Bootstrapping mechanism for the mxGraph thin client. The production version of this file contains all code required to run the mxGraph thin client, as well as global constants to identify the browser and operating system in use. You may have to load chrome://global/content/contentAreaUtils.js in your page to disable certain security restrictions in Mozilla.
| mxClient | Bootstrapping mechanism for the mxGraph thin client. |
| Variables | |
| VERSION | Contains the current version of the mxGraph library. |
| IS_IE | True if the current browser is Internet Explorer 10 or below. |
| IS_IE6 | True if the current browser is Internet Explorer 6.x. |
| IS_IE11 | True if the current browser is Internet Explorer 11.x. |
| IS_EDGE | True if the current browser is Microsoft Edge. |
| IS_QUIRKS | True if the current browser is Internet Explorer and it is in quirks mode. |
| IS_EM | True if the browser is IE11 in enterprise mode (IE8 standards mode). |
| VML_PREFIX | Prefix for VML namespace in node names. |
| OFFICE_PREFIX | Prefix for VML office namespace in node names. |
| IS_NS | True if the current browser is Netscape (including Firefox). |
| IS_OP | True if the current browser is Opera. |
| IS_OT | True if -o-transform is available as a CSS style, ie for Opera browsers based on a Presto engine with version 2.5 or later. |
| IS_SF | True if the current browser is Safari. |
| IS_IOS | Returns true if the user agent is an iPad, iPhone or iPod. |
| IS_GC | True if the current browser is Google Chrome. |
| IS_CHROMEAPP | True if the this is running inside a Chrome App. |
| IS_FF | True if the current browser is Firefox. |
| IS_MT | True if -moz-transform is available as a CSS style. |
| IS_VML | True if the browser supports VML. |
| IS_SVG | True if the browser supports SVG. |
| NO_FO | True if foreignObject support is not available. |
| IS_WIN | True if the client is a Windows. |
| IS_MAC | True if the client is a Mac. |
| IS_CHROMEOS | True if the client is a Chrome OS. |
| IS_TOUCH | True if this device supports touchstart/-move/-end events (Apple iOS, Android, Chromebook and Chrome Browser on touch-enabled devices). |
| IS_POINTER | True if this device supports Microsoft pointer events (always false on Macs). |
| IS_LOCAL | True if the documents location does not start with http:// or https://. |
| defaultBundles | Contains the base names of the default bundles if mxLoadResources is false. |
| Functions | |
| isBrowserSupported | Returns true if the current browser is supported, that is, if mxClient.IS_VML or mxClient.IS_SVG is true. |
| link | Adds a link node to the head of the document. |
| loadResources | Helper method to load the default bundles if mxLoadResources is false. |
| include | Dynamically adds a script node to the document header. |
| Variables | |
| mxLoadResources | Optional global config variable to toggle loading of the two resource files in mxGraph and mxEditor. |
| mxForceIncludes | Optional global config variable to force loading the JavaScript files in development mode. |
| mxResourceExtension | Optional global config variable to specify the extension of resource files. |
| mxLoadStylesheets | Optional global config variable to toggle loading of the CSS files when the library is initialized. |
| basePath | Basepath for all URLs in the core without trailing slash. |
| imageBasePath | Basepath for all images URLs in the core without trailing slash. |
| language | Defines the language of the client, eg. |
| defaultLanguage | Defines the default language which is used in the common resource files. |
| languages | Defines the optional array of all supported language extensions. |
| mxLog | A singleton class that implements a simple console. |
| Variables | |
| consoleName | Specifies the name of the console window. |
| TRACE | Specified if the output for enter and leave should be visible in the console. |
| DEBUG | Specifies if the output for debug should be visible in the console. |
| WARN | Specifies if the output for warn should be visible in the console. |
| buffer | Buffer for pre-initialized content. |
| Functions | |
| init | Initializes the DOM node for the console. |
| info | Writes the current navigator information to the console. |
| addButton | Adds a button to the console using the given label and function. |
| isVisible | Returns true if the console is visible. |
| show | Shows the console. |
| setVisible | Shows or hides the console. |
| enter | Writes the specified string to the console if TRACE is true and returns the current time in milliseconds. |
| leave | Writes the specified string to the console if TRACE is true and computes the difference between the current time and t0 in milliseconds. |
| debug | Adds all arguments to the console if DEBUG is enabled. |
| warn | Adds all arguments to the console if WARN is enabled. |
| write | Adds the specified strings to the console. |
| writeln | Adds the specified strings to the console, appending a linefeed at the end of each string. |
| mxObjectIdentity | Identity for JavaScript objects and functions. |
| Variables | |
| FIELD_NAME | Name of the field to be used to store the object ID. |
| counter | Current counter. |
| Functions | |
| get | Returns the ID for the given object or function or null if no object is specified. |
| clear | Deletes the ID from the given object or function. |
| mxDictionary | A wrapper class for an associative array with object keys. |
| Functions | |
| mxEventSource | Constructs a new dictionary which allows object to be used as keys. |
| map | Stores the (key, value) pairs in this dictionary. |
| clear | Clears the dictionary. |
| get | Returns the value for the given key. |
| put | Stores the value under the given key and returns the previous value for that key. |
| remove | Removes the value for the given key and returns the value that has been removed. |
| getKeys | Returns all keys as an array. |
| getValues | Returns all values as an array. |
| visit | Visits all entries in the dictionary using the given function with the following signature: function(key, value) where key is a string and value is an object. |
| mxResources | Implements internationalization. |
| Variables | |
| resources | Object that maps from keys to values. |
| extension | Specifies the extension used for language files. |
| resourcesEncoded | Specifies whether or not values in resource files are encoded with \u or percentage. |
| loadDefaultBundle | Specifies if the default file for a given basename should be loaded. |
| loadDefaultBundle | Specifies if the specific language file file for a given basename should be loaded. |
| Functions | |
| isLanguageSupported | Hook for subclassers to disable support for a given language. |
| getDefaultBundle | Hook for subclassers to return the URL for the special bundle. |
| getSpecialBundle | Hook for subclassers to return the URL for the special bundle. |
| add | Adds the default and current language properties file for the specified basename. |
| parse | Parses the key, value pairs in the specified text and stores them as local resources. |
| get | Returns the value for the specified resource key. |
| replacePlaceholders | Replaces the given placeholders with the given parameters. |
| loadResources | Loads all required resources asynchronously. |
| mxPoint | Implements a 2-dimensional vector with double precision coordinates. |
| Functions | |
| mxPoint | Constructs a new point for the optional x and y coordinates. |
| Variables | |
| x | Holds the x-coordinate of the point. |
| y | Holds the y-coordinate of the point. |
| Functions | |
| equals | Returns true if the given object equals this point. |
| clone | Returns a clone of this mxPoint. |
| mxRectangle | Extends mxPoint to implement a 2-dimensional rectangle with double precision coordinates. |
| Functions | |
| mxRectangle | Constructs a new rectangle for the optional parameters. |
| Variables | |
| width | Holds the width of the rectangle. |
| height | Holds the height of the rectangle. |
| Functions | |
| setRect | Sets this rectangle to the specified values |
| getCenterX | Returns the x-coordinate of the center point. |
| getCenterY | Returns the y-coordinate of the center point. |
| add | Adds the given rectangle to this rectangle. |
| intersect | Changes this rectangle to where it overlaps with the given rectangle. |
| grow | Grows the rectangle by the given amount, that is, this method subtracts the given amount from the x- and y-coordinates and adds twice the amount to the width and height. |
| getPoint | Returns the top, left corner as a new mxPoint. |
| rotate90 | Rotates this rectangle by 90 degree around its center point. |
| equals | Returns true if the given object equals this rectangle. |
| fromRectangle | Returns a new mxRectangle which is a copy of the given rectangle. |
| mxEffects | Provides animation effects. |
| Functions | |
| animateChanges | Asynchronous animated move operation. |
| cascadeOpacity | Sets the opacity on the given cell and its descendants. |
| fadeOut | Asynchronous fade-out operation. |
| mxUtils | A singleton class that provides cross-browser helper methods. |
| Variables | |
| errorResource | Specifies the resource key for the title of the error window. |
| closeResource | Specifies the resource key for the label of the close button. |
| errorImage | Defines the image used for error dialogs. |
| Functions | |
| removeCursors | Removes the cursors from the style of the given DOM node and its descendants. |
| getCurrentStyle | Returns the current style of the specified element. |
| parseCssNumber | Parses the given CSS numeric value adding handling for the values thin, medium and thick (2, 4 and 6). |
| setPrefixedStyle | Adds the given style with the standard name and an optional vendor prefix for the current browser. |
| hasScrollbars | Returns true if the overflow CSS property of the given node is either scroll or auto. |
| bind | Returns a wrapper function that locks the execution scope of the given function to the specified scope. |
| eval | Evaluates the given expression using eval and returns the JavaScript object that represents the expression result. |
| findNode | Returns the first node where attr equals value. |
| getFunctionName | Returns the name for the given function. |
| indexOf | Returns the index of obj in array or -1 if the array does not contain the given object. |
| forEach | Calls the given function for each element of the given array and returns the array. |
| remove | Removes all occurrences of the given object in the given array or object. |
| isNode | Returns true if the given value is an XML node with the node name and if the optional attribute has the specified value. |
| isAncestorNode | Returns true if the given ancestor is an ancestor of the given DOM node in the DOM. |
| getChildNodes | Returns an array of child nodes that are of the given node type. |
| importNode | Cross browser implementation for document.importNode. |
| createXmlDocument | Returns a new, empty XML document. |
| parseXml | Parses the specified XML string into a new XML document and returns the new document. |
| clearSelection | Clears the current selection in the page. |
| getPrettyXML | Returns a pretty printed string that represents the XML tree for the given node. |
| removeWhitespace | Removes the sibling text nodes for the given node that only consists of tabs, newlines and spaces. |
| htmlEntities | Replaces characters (less than, greater than, newlines and quotes) with their HTML entities in the given string and returns the result. |
| isVml | Returns true if the given node is in the VML namespace. |
| getXml | Returns the XML content of the specified node. |
| extractTextWithWhitespace | Returns the text content of the specified node. |
| replaceTrailingNewlines | Replaces each trailing newline with the given pattern. |
| getTextContent | Returns the text content of the specified node. |
| setTextContent | Sets the text content of the specified node. |
| getInnerHtml | Returns the inner HTML for the given node as a string or an empty string if no node was specified. |
| getOuterHtml | Returns the outer HTML for the given node as a string or an empty string if no node was specified. |
| write | Creates a text node for the given string and appends it to the given parent. |
| writeln | Creates a text node for the given string and appends it to the given parent with an additional linefeed. |
| br | Appends a linebreak to the given parent and returns the linebreak. |
| button | Returns a new button with the given level and function as an onclick event handler. |
| para | Appends a new paragraph with the given text to the specified parent and returns the paragraph. |
| addTransparentBackgroundFilter | Adds a transparent background to the filter of the given node. |
| linkAction | Adds a hyperlink to the specified parent that invokes action on the specified editor. |
| linkInvoke | Adds a hyperlink to the specified parent that invokes the specified function on the editor passing along the specified argument. |
| link | Adds a hyperlink to the specified parent and invokes the given function when the link is clicked. |
| getDocumentSize | Returns the client size for the current document as an mxRectangle. |
| fit | Makes sure the given node is inside the visible area of the window. |
| load | Loads the specified URL synchronously and returns the mxXmlRequest. |
| get | Loads the specified URL asynchronously and invokes the given functions depending on the request status. |
| getAll | Loads the URLs in the given array asynchronously and invokes the given function if all requests returned with a valid 2xx status. |
| post | Posts the specified params to the given URL asynchronously and invokes the given functions depending on the request status. |
| submit | Submits the given parameters to the specified URL using mxXmlRequest.simulate and returns the mxXmlRequest. |
| loadInto | Loads the specified URL asynchronously into the specified document, invoking onload after the document has been loaded. |
| getValue | Returns the value for the given key in the given associative array or the given default value if the value is null. |
| getNumber | Returns the numeric value for the given key in the given associative array or the given default value (or 0) if the value is null. |
| getColor | Returns the color value for the given key in the given associative array or the given default value if the value is null. |
| clone | Recursively clones the specified object ignoring all fieldnames in the given array of transient fields. |
| equalPoints | Compares all mxPoints in the given lists. |
| equalEntries | Returns true if all properties of the given objects are equal. |
| removeDuplicates | Removes all duplicates from the given array. |
| isNaN | Returns true if the given value is of type number and isNaN returns true. |
| extend | Assigns a copy of the superclass prototype to the subclass prototype. |
| toString | Returns a textual representation of the specified object. |
| toRadians | Converts the given degree to radians. |
| toDegree | Converts the given radians to degree. |
| arcToCurves | Converts the given arc to a series of curves. |
| getBoundingBox | Returns the bounding box for the rotated rectangle. |
| getRotatedPoint | Rotates the given point by the given cos and sin. |
| reversePortConstraints | Reverse the port constraint bitmask. |
| findNearestSegment | Finds the index of the nearest segment on the given cell state for the specified coordinate pair. |
| getDirectedBounds | Adds the given margins to the given rectangle and rotates and flips the rectangle according to the respective styles in style. |
| getPerimeterPoint | Returns the intersection between the polygon defined by the array of points and the line between center and point. |
| rectangleIntersectsSegment | Returns true if the given rectangle intersects the given segment. |
| contains | Returns true if the specified point (x, y) is contained in the given rectangle. |
| intersects | Returns true if the two rectangles intersect. |
| intersects | Returns true if the two rectangles intersect. |
| getOffset | Returns the offset for the specified container as an mxPoint. |
| getDocumentScrollOrigin | Returns the scroll origin of the given document or the current document if no document is given. |
| getScrollOrigin | Returns the top, left corner of the viewrect as an mxPoint. |
| convertPoint | Converts the specified point (x, y) using the offset of the specified container and returns a new mxPoint with the result. |
| ltrim | Strips all whitespaces from the beginning of the string. |
| rtrim | Strips all whitespaces from the end of the string. |
| trim | Strips all whitespaces from both end of the string. |
| isNumeric | Returns true if the specified value is numeric, that is, if it is not null, not an empty string, not a HEX number and isNaN returns false. |
| isInteger | Returns true if the given value is an valid integer number. |
| mod | Returns the remainder of division of n by m. |
| intersection | Returns the intersection of two lines as an mxPoint. |
| ptSegDistSq | Returns the square distance between a segment and a point. |
| ptLineDist | Returns the distance between a line defined by two points and a point. |
| relativeCcw | Returns 1 if the given point on the right side of the segment, 0 if its on the segment, and -1 if the point is on the left side of the segment. |
| animateChanges | See mxEffects.animateChanges. |
| cascadeOpacity | See mxEffects.cascadeOpacity. |
| fadeOut | See mxEffects.fadeOut. |
| setOpacity | Sets the opacity of the specified DOM node to the given value in %. |
| createImage | Creates and returns an image (IMG node) or VML image (v:image) in IE6 in quirks mode. |
| sortCells | Sorts the given cells according to the order in the cell hierarchy. |
| getStylename | Returns the stylename in a style of the form [(stylename|key=value);] or an empty string if the given style does not contain a stylename. |
| getStylenames | Returns the stylenames in a style of the form [(stylename|key=value);] or an empty array if the given style does not contain any stylenames. |
| indexOfStylename | Returns the index of the given stylename in the given style. |
| addStylename | Adds the specified stylename to the given style if it does not already contain the stylename. |
| removeStylename | Removes all occurrences of the specified stylename in the given style and returns the updated style. |
| removeAllStylenames | Removes all stylenames from the given style and returns the updated style. |
| setCellStyles | Assigns the value for the given key in the styles of the given cells, or removes the key from the styles if the value is null. |
| setStyle | Adds or removes the given key, value pair to the style and returns the new style. |
| setCellStyleFlags | Sets or toggles the flag bit for the given key in the cell’s styles. |
| setStyleFlag | Sets or removes the given key from the specified style and returns the new style. |
| getAlignmentAsPoint | Returns an mxPoint that represents the horizontal and vertical alignment for numeric computations. |
| getSizeForString | Returns an mxRectangle with the size (width and height in pixels) of the given string. |
| getViewXml | |
| getScaleForPageCount | Returns the scale to be used for printing the graph with the given bounds across the specifies number of pages with the given format. |
| show | Copies the styles and the markup from the graph’s container into the given document and removes all cursor styles. |
| printScreen | Prints the specified graph using a new window and the built-in print dialog. |
| popup | Shows the specified text content in a new mxWindow or a new browser window if isInternalWindow is false. |
| alert | Displayss the given alert in a new dialog. |
| prompt | Displays the given message in a prompt dialog. |
| confirm | Displays the given message in a confirm dialog. |
| error | Displays the given error message in a new mxWindow of the given width. |
| makeDraggable | Configures the given DOM element to act as a drag source for the specified graph. |
| mxConstants | Defines various global constants. |
| Variables | |
| DEFAULT_HOTSPOT | Defines the portion of the cell which is to be used as a connectable region. |
| MIN_HOTSPOT_SIZE | Defines the minimum size in pixels of the portion of the cell which is to be used as a connectable region. |
| MAX_HOTSPOT_SIZE | Defines the maximum size in pixels of the portion of the cell which is to be used as a connectable region. |
| RENDERING_HINT_EXACT | Defines the exact rendering hint. |
| RENDERING_HINT_FASTER | Defines the faster rendering hint. |
| RENDERING_HINT_FASTEST | Defines the fastest rendering hint. |
| DIALECT_SVG | Defines the SVG display dialect name. |
| DIALECT_VML | Defines the VML display dialect name. |
| DIALECT_MIXEDHTML | Defines the mixed HTML display dialect name. |
| DIALECT_PREFERHTML | Defines the preferred HTML display dialect name. |
| DIALECT_STRICTHTML | Defines the strict HTML display dialect. |
| NS_SVG | Defines the SVG namespace. |
| NS_XHTML | Defines the XHTML namespace. |
| NS_XLINK | Defines the XLink namespace. |
| SHADOWCOLOR | Defines the color to be used to draw shadows in shapes and windows. |
| VML_SHADOWCOLOR | Used for shadow color in filters where transparency is not supported (Microsoft Internet Explorer). |
| SHADOW_OFFSET_X | Specifies the x-offset of the shadow. |
| SHADOW_OFFSET_Y | Specifies the y-offset of the shadow. |
| SHADOW_OPACITY | Defines the opacity for shadows. |
| NODETYPE_ELEMENT | DOM node of type ELEMENT. |
| NODETYPE_ATTRIBUTE | DOM node of type ATTRIBUTE. |
| NODETYPE_TEXT | DOM node of type TEXT. |
| NODETYPE_CDATA | DOM node of type CDATA. |
| NODETYPE_ENTITY_REFERENCE | DOM node of type ENTITY_REFERENCE. |
| NODETYPE_ENTITY | DOM node of type ENTITY. |
| NODETYPE_PROCESSING_INSTRUCTION | DOM node of type PROCESSING_INSTRUCTION. |
| NODETYPE_COMMENT | DOM node of type COMMENT. |
| NODETYPE_DOCUMENT | DOM node of type DOCUMENT. |
| NODETYPE_DOCUMENTTYPE | DOM node of type DOCUMENTTYPE. |
| NODETYPE_DOCUMENT_FRAGMENT | DOM node of type DOCUMENT_FRAGMENT. |
| NODETYPE_NOTATION | DOM node of type NOTATION. |
| TOOLTIP_VERTICAL_OFFSET | Defines the vertical offset for the tooltip. |
| DEFAULT_VALID_COLOR | Specifies the default valid color. |
| DEFAULT_INVALID_COLOR | Specifies the default invalid color. |
| OUTLINE_HIGHLIGHT_COLOR | Specifies the default highlight color for shape outlines. |
| OUTLINE_HIGHLIGHT_COLOR | Defines the strokewidth to be used for shape outlines. |
| HIGHLIGHT_STROKEWIDTH | Defines the strokewidth to be used for the highlights. |
| CONSTRAINT_HIGHLIGHT_SIZE | Size of the constraint highlight (in px). |
| HIGHLIGHT_OPACITY | Opacity (in %) used for the highlights (including outline). |
| CURSOR_MOVABLE_VERTEX | Defines the cursor for a movable vertex. |
| CURSOR_MOVABLE_EDGE | Defines the cursor for a movable edge. |
| CURSOR_LABEL_HANDLE | Defines the cursor for a movable label. |
| CURSOR_TERMINAL_HANDLE | Defines the cursor for a terminal handle. |
| CURSOR_BEND_HANDLE | Defines the cursor for a movable bend. |
| CURSOR_VIRTUAL_BEND_HANDLE | Defines the cursor for a movable bend. |
| CURSOR_CONNECT | Defines the cursor for a connectable state. |
| HIGHLIGHT_COLOR | Defines the color to be used for the cell highlighting. |
| TARGET_HIGHLIGHT_COLOR | Defines the color to be used for highlighting a target cell for a new or changed connection. |
| INVALID_CONNECT_TARGET_COLOR | Defines the color to be used for highlighting a invalid target cells for a new or changed connections. |
| DROP_TARGET_COLOR | Defines the color to be used for the highlighting target parent cells (for drag and drop). |
| VALID_COLOR | Defines the color to be used for the coloring valid connection previews. |
| INVALID_COLOR | Defines the color to be used for the coloring invalid connection previews. |
| EDGE_SELECTION_COLOR | Defines the color to be used for the selection border of edges. |
| VERTEX_SELECTION_COLOR | Defines the color to be used for the selection border of vertices. |
| VERTEX_SELECTION_STROKEWIDTH | Defines the strokewidth to be used for vertex selections. |
| EDGE_SELECTION_STROKEWIDTH | Defines the strokewidth to be used for edge selections. |
| SELECTION_DASHED | Defines the dashed state to be used for the vertex selection border. |
| SELECTION_DASHED | Defines the dashed state to be used for the edge selection border. |
| GUIDE_COLOR | Defines the color to be used for the guidelines in mxGraphHandler. |
| GUIDE_STROKEWIDTH | Defines the strokewidth to be used for the guidelines in mxGraphHandler. |
| OUTLINE_COLOR | Defines the color to be used for the outline rectangle border. |
| OUTLINE_STROKEWIDTH | Defines the strokewidth to be used for the outline rectangle stroke width. |
| HANDLE_SIZE | Defines the default size for handles. |
| LABEL_HANDLE_SIZE | Defines the default size for label handles. |
| HANDLE_FILLCOLOR | Defines the color to be used for the handle fill color. |
| HANDLE_STROKECOLOR | Defines the color to be used for the handle stroke color. |
| LABEL_HANDLE_FILLCOLOR | Defines the color to be used for the label handle fill color. |
| CONNECT_HANDLE_FILLCOLOR | Defines the color to be used for the connect handle fill color. |
| LOCKED_HANDLE_FILLCOLOR | Defines the color to be used for the locked handle fill color. |
| OUTLINE_HANDLE_FILLCOLOR | Defines the color to be used for the outline sizer fill color. |
| OUTLINE_HANDLE_STROKECOLOR | Defines the color to be used for the outline sizer stroke color. |
| DEFAULT_FONTFAMILY | Defines the default family for all fonts. |
| DEFAULT_FONTSIZE | Defines the default size (in px). |
| DEFAULT_TEXT_DIRECTION | Defines the default value for the STYLE_TEXT_DIRECTION if no value is defined for it in the style. |
| LINE_HEIGHT | Defines the default line height for text labels. |
| WORD_WRAP | Defines the CSS value for the word-wrap property. |
| ABSOLUTE_LINE_HEIGHT | Specifies if absolute line heights should be used (px) in CSS. |
| DEFAULT_FONTSTYLE | Defines the default style for all fonts. |
| DEFAULT_STARTSIZE | Defines the default start size for swimlanes. |
| DEFAULT_MARKERSIZE | Defines the default size for all markers. |
| DEFAULT_IMAGESIZE | Defines the default width and height for images used in the label shape. |
| ENTITY_SEGMENT | Defines the length of the horizontal segment of an Entity Relation. |
| RECTANGLE_ROUNDING_FACTOR | Defines the rounding factor for rounded rectangles in percent between 0 and 1. |
| LINE_ARCSIZE | Defines the size of the arcs for rounded edges. |
| ARROW_SPACING | Defines the spacing between the arrow shape and its terminals. |
| ARROW_WIDTH | Defines the width of the arrow shape. |
| ARROW_SIZE | Defines the size of the arrowhead in the arrow shape. |
| PAGE_FORMAT_A4_PORTRAIT | Defines the rectangle for the A4 portrait page format. |
| PAGE_FORMAT_A4_PORTRAIT | Defines the rectangle for the A4 portrait page format. |
| PAGE_FORMAT_LETTER_PORTRAIT | Defines the rectangle for the Letter portrait page format. |
| PAGE_FORMAT_LETTER_PORTRAIT | Defines the rectangle for the Letter portrait page format. |
| NONE | Defines the value for none. |
| STYLE_PERIMETER | Defines the key for the perimeter style. |
| STYLE_SOURCE_PORT | Defines the ID of the cell that should be used for computing the perimeter point of the source for an edge. |
| STYLE_TARGET_PORT | Defines the ID of the cell that should be used for computing the perimeter point of the target for an edge. |
| STYLE_PORT_CONSTRAINT | Defines the direction(s) that edges are allowed to connect to cells in. |
| STYLE_PORT_CONSTRAINT_ROTATION | Define whether port constraint directions are rotated with vertex rotation. |
| STYLE_SOURCE_PORT_CONSTRAINT | Defines the direction(s) that edges are allowed to connect to sources in. |
| STYLE_TARGET_PORT_CONSTRAINT | Defines the direction(s) that edges are allowed to connect to targets in. |
| STYLE_OPACITY | Defines the key for the opacity style. |
| STYLE_FILL_OPACITY | Defines the key for the fill opacity style. |
| STYLE_STROKE_OPACITY | Defines the key for the stroke opacity style. |
| STYLE_TEXT_OPACITY | Defines the key for the text opacity style. |
| STYLE_TEXT_DIRECTION | Defines the key for the text direction style. |
| STYLE_OVERFLOW | Defines the key for the overflow style. |
| STYLE_ORTHOGONAL | Defines if the connection points on either end of the edge should be computed so that the edge is vertical or horizontal if possible and if the point is not at a fixed location. |
| STYLE_EXIT_X | Defines the key for the horizontal relative coordinate connection point of an edge with its source terminal. |
| STYLE_EXIT_Y | Defines the key for the vertical relative coordinate connection point of an edge with its source terminal. |
| STYLE_EXIT_DX | Defines the key for the horizontal offset of the connection point of an edge with its source terminal. |
| STYLE_EXIT_DY | Defines the key for the vertical offset of the connection point of an edge with its source terminal. |
| STYLE_EXIT_PERIMETER | Defines if the perimeter should be used to find the exact entry point along the perimeter of the source. |
| STYLE_ENTRY_X | Defines the key for the horizontal relative coordinate connection point of an edge with its target terminal. |
| STYLE_ENTRY_Y | Defines the key for the vertical relative coordinate connection point of an edge with its target terminal. |
| STYLE_ENTRY_DX | Defines the key for the horizontal offset of the connection point of an edge with its target terminal. |
| STYLE_ENTRY_DY | Defines the key for the vertical offset of the connection point of an edge with its target terminal. |
| STYLE_ENTRY_PERIMETER | Defines if the perimeter should be used to find the exact entry point along the perimeter of the target. |
| STYLE_WHITE_SPACE | Defines the key for the white-space style. |
| STYLE_ROTATION | Defines the key for the rotation style. |
| STYLE_FILLCOLOR | Defines the key for the fill color. |
| STYLE_POINTER_EVENTS | Specifies if pointer events should be fired on transparent backgrounds. |
| STYLE_SWIMLANE_FILLCOLOR | Defines the key for the fill color of the swimlane background. |
| STYLE_MARGIN | Defines the key for the margin between the ellipses in the double ellipse shape. |
| STYLE_GRADIENTCOLOR | Defines the key for the gradient color. |
| STYLE_GRADIENT_DIRECTION | Defines the key for the gradient direction. |
| STYLE_STROKECOLOR | Defines the key for the strokeColor style. |
| STYLE_SEPARATORCOLOR | Defines the key for the separatorColor style. |
| STYLE_STROKEWIDTH | Defines the key for the strokeWidth style. |
| STYLE_ALIGN | Defines the key for the align style. |
| STYLE_VERTICAL_ALIGN | Defines the key for the verticalAlign style. |
| STYLE_LABEL_WIDTH | Defines the key for the width of the label if the label position is not center. |
| STYLE_LABEL_POSITION | Defines the key for the horizontal label position of vertices. |
| STYLE_VERTICAL_LABEL_POSITION | Defines the key for the vertical label position of vertices. |
| STYLE_IMAGE_ASPECT | Defines the key for the image aspect style. |
| STYLE_IMAGE_ALIGN | Defines the key for the align style. |
| STYLE_IMAGE_VERTICAL_ALIGN | Defines the key for the verticalAlign style. |
| STYLE_GLASS | Defines the key for the glass style. |
| STYLE_IMAGE | Defines the key for the image style. |
| STYLE_IMAGE_WIDTH | Defines the key for the imageWidth style. |
| STYLE_IMAGE_HEIGHT | Defines the key for the imageHeight style. |
| STYLE_IMAGE_BACKGROUND | Defines the key for the image background color. |
| STYLE_IMAGE_BORDER | Defines the key for the image border color. |
| STYLE_FLIPH | Defines the key for the horizontal image flip. |
| STYLE_FLIPV | Defines the key for the vertical flip. |
| STYLE_NOLABEL | Defines the key for the noLabel style. |
| STYLE_NOEDGESTYLE | Defines the key for the noEdgeStyle style. |
| STYLE_LABEL_BACKGROUNDCOLOR | Defines the key for the label background color. |
| STYLE_LABEL_BORDERCOLOR | Defines the key for the label border color. |
| STYLE_LABEL_PADDING | Defines the key for the label padding, ie. |
| STYLE_INDICATOR_SHAPE | Defines the key for the indicator shape used within an mxLabel. |
| STYLE_INDICATOR_IMAGE | Defines the key for the indicator image used within an mxLabel. |
| STYLE_INDICATOR_COLOR | Defines the key for the indicatorColor style. |
| STYLE_INDICATOR_STROKECOLOR | Defines the key for the indicator stroke color in mxLabel. |
| STYLE_INDICATOR_GRADIENTCOLOR | Defines the key for the indicatorGradientColor style. |
| STYLE_INDICATOR_SPACING | The defines the key for the spacing between the label and the indicator in mxLabel. |
| STYLE_INDICATOR_WIDTH | Defines the key for the indicator width. |
| STYLE_INDICATOR_HEIGHT | Defines the key for the indicator height. |
| STYLE_INDICATOR_DIRECTION | Defines the key for the indicatorDirection style. |
| STYLE_SHADOW | Defines the key for the shadow style. |
| STYLE_SEGMENT | Defines the key for the segment style. |
| STYLE_ENDARROW | Defines the key for the end arrow marker. |
| STYLE_STARTARROW | Defines the key for the start arrow marker. |
| STYLE_ENDSIZE | Defines the key for the endSize style. |
| STYLE_STARTSIZE | Defines the key for the startSize style. |
| STYLE_SWIMLANE_LINE | Defines the key for the swimlaneLine style. |
| STYLE_ENDFILL | Defines the key for the endFill style. |
| STYLE_STARTFILL | Defines the key for the startFill style. |
| STYLE_DASHED | Defines the key for the dashed style. |
| STYLE_FIX_DASH | Defines the key for the fixDash style. |
| STYLE_ROUNDED | Defines the key for the rounded style. |
| STYLE_CURVED | Defines the key for the curved style. |
| STYLE_ARCSIZE | Defines the rounding factor for a rounded rectangle in percent (without the percent sign). |
| STYLE_ABSOLUTE_ARCSIZE | Defines the key for the absolute arc size style. |
| STYLE_SOURCE_PERIMETER_SPACING | Defines the key for the source perimeter spacing. |
| STYLE_TARGET_PERIMETER_SPACING | Defines the key for the target perimeter spacing. |
| STYLE_PERIMETER_SPACING | Defines the key for the perimeter spacing. |
| STYLE_SPACING | Defines the key for the spacing. |
| STYLE_SPACING_TOP | Defines the key for the spacingTop style. |
| STYLE_SPACING_LEFT | Defines the key for the spacingLeft style. |
| STYLE_SPACING_BOTTOM | Defines the key for the spacingBottom style The value represents the spacing, in pixels, added to the bottom side of a label in a vertex (style applies to vertices only). |
| STYLE_SPACING_RIGHT | Defines the key for the spacingRight style The value represents the spacing, in pixels, added to the right side of a label in a vertex (style applies to vertices only). |
| STYLE_HORIZONTAL | Defines the key for the horizontal style. |
| STYLE_DIRECTION | Defines the key for the direction style. |
| STYLE_ANCHOR_POINT_DIRECTION | Defines the key for the anchorPointDirection style. |
| STYLE_ELBOW | Defines the key for the elbow style. |
| STYLE_FONTCOLOR | Defines the key for the fontColor style. |
| STYLE_FONTFAMILY | Defines the key for the fontFamily style. |
| STYLE_FONTSIZE | Defines the key for the fontSize style (in px). |
| STYLE_FONTSTYLE | Defines the key for the fontStyle style. |
| STYLE_ASPECT | Defines the key for the aspect style. |
| STYLE_AUTOSIZE | Defines the key for the autosize style. |
| STYLE_FOLDABLE | Defines the key for the foldable style. |
| STYLE_EDITABLE | Defines the key for the editable style. |
| STYLE_BACKGROUND_OUTLINE | Defines the key for the backgroundOutline style. |
| STYLE_BENDABLE | Defines the key for the bendable style. |
| STYLE_MOVABLE | Defines the key for the movable style. |
| STYLE_RESIZABLE | Defines the key for the resizable style. |
| STYLE_RESIZE_WIDTH | Defines the key for the resizeWidth style. |
| STYLE_RESIZE_WIDTH | Defines the key for the resizeHeight style. |
| STYLE_ROTATABLE | Defines the key for the rotatable style. |
| STYLE_CLONEABLE | Defines the key for the cloneable style. |
| STYLE_DELETABLE | Defines the key for the deletable style. |
| STYLE_SHAPE | Defines the key for the shape. |
| STYLE_EDGE | Defines the key for the edge style. |
| STYLE_JETTY_SIZE | Defines the key for the jetty size in mxEdgeStyle.OrthConnector. |
| STYLE_SOURCE_JETTY_SIZE | Defines the key for the jetty size in mxEdgeStyle.OrthConnector. |
| targetJettySize | Defines the key for the jetty size in mxEdgeStyle.OrthConnector. |
| STYLE_LOOP | Defines the key for the loop style. |
| STYLE_ORTHOGONAL_LOOP | Defines the key for the orthogonal loop style. |
| STYLE_ROUTING_CENTER_X | Defines the key for the horizontal routing center. |
| STYLE_ROUTING_CENTER_Y | Defines the key for the vertical routing center. |
| FONT_BOLD | Constant for bold fonts. |
| FONT_ITALIC | Constant for italic fonts. |
| FONT_UNDERLINE | Constant for underlined fonts. |
| SHAPE_RECTANGLE | Name under which mxRectangleShape is registered in mxCellRenderer. |
| SHAPE_ELLIPSE | Name under which mxEllipse is registered in mxCellRenderer. |
| SHAPE_DOUBLE_ELLIPSE | Name under which mxDoubleEllipse is registered in mxCellRenderer. |
| SHAPE_RHOMBUS | Name under which mxRhombus is registered in mxCellRenderer. |
| SHAPE_LINE | Name under which mxLine is registered in mxCellRenderer. |
| SHAPE_IMAGE | Name under which mxImageShape is registered in mxCellRenderer. |
| SHAPE_ARROW | Name under which mxArrow is registered in mxCellRenderer. |
| SHAPE_ARROW_CONNECTOR | Name under which mxArrowConnector is registered in mxCellRenderer. |
| SHAPE_LABEL | Name under which mxLabel is registered in mxCellRenderer. |
| SHAPE_CYLINDER | Name under which mxCylinder is registered in mxCellRenderer. |
| SHAPE_SWIMLANE | Name under which mxSwimlane is registered in mxCellRenderer. |
| SHAPE_CONNECTOR | Name under which mxConnector is registered in mxCellRenderer. |
| SHAPE_ACTOR | Name under which mxActor is registered in mxCellRenderer. |
| SHAPE_CLOUD | Name under which mxCloud is registered in mxCellRenderer. |
| SHAPE_TRIANGLE | Name under which mxTriangle is registered in mxCellRenderer. |
| SHAPE_HEXAGON | Name under which mxHexagon is registered in mxCellRenderer. |
| ARROW_CLASSIC | Constant for classic arrow markers. |
| ARROW_CLASSIC_THIN | Constant for thin classic arrow markers. |
| ARROW_BLOCK | Constant for block arrow markers. |
| ARROW_BLOCK_THIN | Constant for thin block arrow markers. |
| ARROW_OPEN | Constant for open arrow markers. |
| ARROW_OPEN_THIN | Constant for thin open arrow markers. |
| ARROW_OVAL | Constant for oval arrow markers. |
| ARROW_DIAMOND | Constant for diamond arrow markers. |
| ARROW_DIAMOND_THIN | Constant for thin diamond arrow markers. |
| ALIGN_LEFT | Constant for left horizontal alignment. |
| ALIGN_CENTER | Constant for center horizontal alignment. |
| ALIGN_RIGHT | Constant for right horizontal alignment. |
| ALIGN_TOP | Constant for top vertical alignment. |
| ALIGN_MIDDLE | Constant for middle vertical alignment. |
| ALIGN_BOTTOM | Constant for bottom vertical alignment. |
| DIRECTION_NORTH | Constant for direction north. |
| DIRECTION_SOUTH | Constant for direction south. |
| DIRECTION_EAST | Constant for direction east. |
| DIRECTION_WEST | Constant for direction west. |
| TEXT_DIRECTION_DEFAULT | Constant for text direction default. |
| TEXT_DIRECTION_AUTO | Constant for text direction automatic. |
| TEXT_DIRECTION_LTR | Constant for text direction left to right. |
| TEXT_DIRECTION_RTL | Constant for text direction right to left. |
| DIRECTION_MASK_NONE | Constant for no direction. |
| DIRECTION_MASK_WEST | Bitwise mask for west direction. |
| DIRECTION_MASK_NORTH | Bitwise mask for north direction. |
| DIRECTION_MASK_SOUTH | Bitwise mask for south direction. |
| DIRECTION_MASK_EAST | Bitwise mask for east direction. |
| DIRECTION_MASK_ALL | Bitwise mask for all directions. |
| ELBOW_VERTICAL | Constant for elbow vertical. |
| ELBOW_HORIZONTAL | Constant for elbow horizontal. |
| EDGESTYLE_ELBOW | Name of the elbow edge style. |
| EDGESTYLE_ENTITY_RELATION | Name of the entity relation edge style. |
| EDGESTYLE_LOOP | Name of the loop edge style. |
| EDGESTYLE_SIDETOSIDE | Name of the side to side edge style. |
| EDGESTYLE_TOPTOBOTTOM | Name of the top to bottom edge style. |
| EDGESTYLE_ORTHOGONAL | Name of the generic orthogonal edge style. |
| EDGESTYLE_SEGMENT | Name of the generic segment edge style. |
| PERIMETER_ELLIPSE | Name of the ellipse perimeter. |
| PERIMETER_RECTANGLE | Name of the rectangle perimeter. |
| PERIMETER_RHOMBUS | Name of the rhombus perimeter. |
| PERIMETER_HEXAGON | Name of the hexagon perimeter. |
| PERIMETER_TRIANGLE | Name of the triangle perimeter. |
| mxEventObject | The mxEventObject is a wrapper for all properties of a single event. |
| Functions | |
| mxEventObject | Constructs a new event object with the specified name. |
| Variables | |
| name | Holds the name. |
| properties | Holds the properties as an associative array. |
| consumed | Holds the consumed state. |
| Functions | |
| getName | Returns name. |
| getProperties | Returns properties. |
| getProperty | Returns the property for the given key. |
| isConsumed | Returns true if the event has been consumed. |
| consume | Consumes the event. |
| mxMouseEvent | Base class for all mouse events in mxGraph. |
| Functions | |
| mxMouseEvent | Constructs a new event object for the given arguments. |
| Variables | |
| consumed | Holds the consumed state of this event. |
| evt | Holds the inner event object. |
| graphX | Holds the x-coordinate of the event in the graph. |
| graphY | Holds the y-coordinate of the event in the graph. |
| state | Holds the optional mxCellState associated with this event. |
| sourceState | Holds the mxCellState that was passed to the constructor. |
| Functions | |
| getEvent | Returns evt. |
| getSource | Returns the target DOM element using mxEvent.getSource for evt. |
| isSource | Returns true if the given mxShape is the source of evt. |
| getX | Returns <evt.clientX>. |
| getY | Returns <evt.clientY>. |
| getGraphX | Returns graphX. |
| getGraphY | Returns graphY. |
| getState | Returns state. |
| getCell | Returns the mxCell in state is not null. |
| isPopupTrigger | Returns true if the event is a popup trigger. |
| isConsumed | Returns consumed. |
| consume | Sets consumed to true and invokes preventDefault on the native event if such a method is defined. |
| mxEventSource | Base class for objects that dispatch named events. |
| Functions | |
| mxEventSource | Constructs a new event source. |
| Variables | |
| eventListeners | Holds the event names and associated listeners in an array. |
| eventsEnabled | Specifies if events can be fired. |
| eventSource | Optional source for events. |
| Functions | |
| isEventsEnabled | Returns eventsEnabled. |
| setEventsEnabled | Sets eventsEnabled. |
| getEventSource | Returns eventSource. |
| setEventSource | Sets eventSource. |
| addListener | Binds the specified function to the given event name. |
| removeListener | Removes all occurrences of the given listener from eventListeners. |
| fireEvent | Dispatches the given event to the listeners which are registered for the event. |
| mxEvent | Cross-browser DOM event support. |
| Functions | |
| addListener | Binds the function to the specified event on the given element. |
| removeListener | Removes the specified listener from the given element. |
| removeAllListeners | Removes all listeners from the given element. |
| addGestureListeners | Adds the given listeners for touch, mouse and/or pointer events. |
| removeGestureListeners | Removes the given listeners from mousedown, mousemove, mouseup and the respective touch events if mxClient.IS_TOUCH is true. |
| redirectMouseEvents | Redirects the mouse events from the given DOM node to the graph dispatch loop using the event and given state as event arguments. |
| release | Removes the known listeners from the given DOM node and its descendants. |
| disableContextMenu | Disables the context menu for the given element. |
| getSource | Returns the event’s target or srcElement depending on the browser. |
| isConsumed | Returns true if the event has been consumed using consume. |
| isTouchEvent | Returns true if the event was generated using a touch device (not a pen or mouse). |
| isPenEvent | Returns true if the event was generated using a pen (not a touch device or mouse). |
| isMultiTouchEvent | Returns true if the event was generated using a touch device (not a pen or mouse). |
| isMouseEvent | Returns true if the event was generated using a mouse (not a pen or touch device). |
| isLeftMouseButton | Returns true if the left mouse button is pressed for the given event. |
| isMiddleMouseButton | Returns true if the middle mouse button is pressed for the given event. |
| isRightMouseButton | Returns true if the right mouse button was pressed. |
| isPopupTrigger | Returns true if the event is a popup trigger. |
| isShiftDown | Returns true if the shift key is pressed for the given event. |
| isAltDown | Returns true if the alt key is pressed for the given event. |
| isControlDown | Returns true if the control key is pressed for the given event. |
| isMetaDown | Returns true if the meta key is pressed for the given event. |
| getMainEvent | Returns the touch or mouse event that contains the mouse coordinates. |
| getClientX | Returns true if the meta key is pressed for the given event. |
| getClientY | Returns true if the meta key is pressed for the given event. |
| consume | Consumes the given event. |
| Variables | |
| LABEL_HANDLE | Index for the label handle in an mxMouseEvent. |
| ROTATION_HANDLE | Index for the rotation handle in an mxMouseEvent. |
| CUSTOM_HANDLE | Start index for the custom handles in an mxMouseEvent. |
| VIRTUAL_HANDLE | Start index for the virtual handles in an mxMouseEvent. |
| MOUSE_DOWN | Specifies the event name for mouseDown. |
| MOUSE_MOVE | Specifies the event name for mouseMove. |
| MOUSE_UP | Specifies the event name for mouseUp. |
| ACTIVATE | Specifies the event name for activate. |
| RESIZE_START | Specifies the event name for resizeStart. |
| RESIZE | Specifies the event name for resize. |
| RESIZE_END | Specifies the event name for resizeEnd. |
| MOVE_START | Specifies the event name for moveStart. |
| MOVE | Specifies the event name for move. |
| MOVE_END | Specifies the event name for moveEnd. |
| PAN_START | Specifies the event name for panStart. |
| PAN | Specifies the event name for pan. |
| PAN_END | Specifies the event name for panEnd. |
| MINIMIZE | Specifies the event name for minimize. |
| NORMALIZE | Specifies the event name for normalize. |
| MAXIMIZE | Specifies the event name for maximize. |
| HIDE | Specifies the event name for hide. |
| SHOW | Specifies the event name for show. |
| CLOSE | Specifies the event name for close. |
| DESTROY | Specifies the event name for destroy. |
| REFRESH | Specifies the event name for refresh. |
| SIZE | Specifies the event name for size. |
| SELECT | Specifies the event name for select. |
| FIRED | Specifies the event name for fired. |
| FIRE_MOUSE_EVENT | Specifies the event name for fireMouseEvent. |
| GESTURE | Specifies the event name for gesture. |
| TAP_AND_HOLD | Specifies the event name for tapAndHold. |
| GET | Specifies the event name for get. |
| RECEIVE | Specifies the event name for receive. |
| CONNECT | Specifies the event name for connect. |
| DISCONNECT | Specifies the event name for disconnect. |
| SUSPEND | Specifies the event name for suspend. |
| RESUME | Specifies the event name for suspend. |
| MARK | Specifies the event name for mark. |
| ROOT | Specifies the event name for root. |
| POST | Specifies the event name for post. |
| OPEN | Specifies the event name for open. |
| SAVE | Specifies the event name for open. |
| BEFORE_ADD_VERTEX | Specifies the event name for beforeAddVertex. |
| ADD_VERTEX | Specifies the event name for addVertex. |
| AFTER_ADD_VERTEX | Specifies the event name for afterAddVertex. |
| DONE | Specifies the event name for done. |
| EXECUTE | Specifies the event name for execute. |
| EXECUTED | Specifies the event name for executed. |
| BEGIN_UPDATE | Specifies the event name for beginUpdate. |
| START_EDIT | Specifies the event name for startEdit. |
| END_UPDATE | Specifies the event name for endUpdate. |
| END_EDIT | Specifies the event name for endEdit. |
| BEFORE_UNDO | Specifies the event name for beforeUndo. |
| UNDO | Specifies the event name for undo. |
| REDO | Specifies the event name for redo. |
| CHANGE | Specifies the event name for change. |
| NOTIFY | Specifies the event name for notify. |
| LAYOUT_CELLS | Specifies the event name for layoutCells. |
| CLICK | Specifies the event name for click. |
| SCALE | Specifies the event name for scale. |
| TRANSLATE | Specifies the event name for translate. |
| SCALE_AND_TRANSLATE | Specifies the event name for scaleAndTranslate. |
| UP | Specifies the event name for up. |
| DOWN | Specifies the event name for down. |
| ADD | Specifies the event name for add. |
| REMOVE | Specifies the event name for remove. |
| CLEAR | Specifies the event name for clear. |
| ADD_CELLS | Specifies the event name for addCells. |
| CELLS_ADDED | Specifies the event name for cellsAdded. |
| MOVE_CELLS | Specifies the event name for moveCells. |
| CELLS_MOVED | Specifies the event name for cellsMoved. |
| RESIZE_CELLS | Specifies the event name for resizeCells. |
| CELLS_RESIZED | Specifies the event name for cellsResized. |
| TOGGLE_CELLS | Specifies the event name for toggleCells. |
| CELLS_TOGGLED | Specifies the event name for cellsToggled. |
| ORDER_CELLS | Specifies the event name for orderCells. |
| CELLS_ORDERED | Specifies the event name for cellsOrdered. |
| REMOVE_CELLS | Specifies the event name for removeCells. |
| CELLS_REMOVED | Specifies the event name for cellsRemoved. |
| GROUP_CELLS | Specifies the event name for groupCells. |
| UNGROUP_CELLS | Specifies the event name for ungroupCells. |
| REMOVE_CELLS_FROM_PARENT | Specifies the event name for removeCellsFromParent. |
| FOLD_CELLS | Specifies the event name for foldCells. |
| CELLS_FOLDED | Specifies the event name for cellsFolded. |
| ALIGN_CELLS | Specifies the event name for alignCells. |
| LABEL_CHANGED | Specifies the event name for labelChanged. |
| CONNECT_CELL | Specifies the event name for connectCell. |
| CELL_CONNECTED | Specifies the event name for cellConnected. |
| SPLIT_EDGE | Specifies the event name for splitEdge. |
| FLIP_EDGE | Specifies the event name for flipEdge. |
| START_EDITING | Specifies the event name for startEditing. |
| EDITING_STARTED | Specifies the event name for editingStarted. |
| EDITING_STOPPED | Specifies the event name for editingStopped. |
| ADD_OVERLAY | Specifies the event name for addOverlay. |
| REMOVE_OVERLAY | Specifies the event name for removeOverlay. |
| UPDATE_CELL_SIZE | Specifies the event name for updateCellSize. |
| ESCAPE | Specifies the event name for escape. |
| DOUBLE_CLICK | Specifies the event name for doubleClick. |
| START | Specifies the event name for start. |
| RESET | Specifies the event name for reset. |
| mxXmlRequest | XML HTTP request wrapper. |
| Functions | |
| mxXmlRequest | Constructs an XML HTTP request. |
| Variables | |
| url | Holds the target URL of the request. |
| params | Holds the form encoded data for the POST request. |
| method | Specifies the request method. |
| async | Boolean indicating if the request is asynchronous. |
| binary | Boolean indicating if the request is binary. |
| withCredentials | Specifies if withCredentials should be used in HTML5-compliant browsers. |
| username | Specifies the username to be used for authentication. |
| password | Specifies the password to be used for authentication. |
| request | Holds the inner, browser-specific request object. |
| decodeSimulateValues | Specifies if request values should be decoded as URIs before setting the textarea value in simulate. |
| Functions | |
| isBinary | Returns binary. |
| setBinary | Sets binary. |
| getText | Returns the response as a string. |
| isReady | Returns true if the response is ready. |
| getDocumentElement | Returns the document element of the response XML document. |
| getXml | Returns the response as an XML document. |
| getText | Returns the response as a string. |
| getStatus | Returns the status as a number, eg. |
| create | Creates and returns the inner request object. |
| send | Send the request to the target URL using the specified functions to process the response asychronously. |
| setRequestHeaders | Sets the headers for the given request and parameters. |
| simulate | Creates and posts a request to the given target URL using a dynamically created form inside the given document. |
| mxClipboard | Singleton that implements a clipboard for graph cells. |
| Variables | |
| STEPSIZE | Defines the step size to offset the cells after each paste operation. |
| insertCount | Counts the number of times the clipboard data has been inserted. |
| cells | Holds the array of mxCells currently in the clipboard. |
| Functions | |
| setCells | Sets the cells in the clipboard. |
| getCells | Returns the cells in the clipboard. |
| isEmpty | Returns true if the clipboard currently has not data stored. |
| cut | Cuts the given array of mxCells from the specified graph. |
| removeCells | Hook to remove the given cells from the given graph after a cut operation. |
| copy | Copies the given array of mxCells from the specified graph to cells. |
| paste | Pastes the cells into the specified graph restoring the relation to <parents>, if possible. |
| mxWindow | Basic window inside a document. |
| Events | |
| mxEvent. | Fires before the window is moved. |
| mxEvent.MOVE | Fires while the window is being moved. |
| mxEvent. | Fires after the window is moved. |
| mxEvent. | Fires before the window is resized. |
| mxEvent. | Fires while the window is being resized. |
| mxEvent. | Fires after the window is resized. |
| mxEvent. | Fires after the window is maximized. |
| mxEvent. | Fires after the window is minimized. |
| mxEvent. | Fires after the window is normalized, that is, it returned from maximized or minimized state. |
| mxEvent. | Fires after a window is activated. |
| mxEvent.SHOW | Fires after the window is shown. |
| mxEvent.HIDE | Fires after the window is hidden. |
| mxEvent. | Fires before the window is closed. |
| mxEvent. | Fires before the window is destroyed. |
| Functions | |
| mxWindow | Constructs a new window with the given dimension and title to display the specified content. |
| Variables | |
| closeImage | URL of the image to be used for the close icon in the titlebar. |
| minimizeImage | URL of the image to be used for the minimize icon in the titlebar. |
| normalizeImage | URL of the image to be used for the normalize icon in the titlebar. |
| maximizeImage | URL of the image to be used for the maximize icon in the titlebar. |
| normalizeImage | URL of the image to be used for the resize icon. |
| visible | Boolean flag that represents the visible state of the window. |
| minimumSize | mxRectangle that specifies the minimum width and height of the window. |
| destroyOnClose | Specifies if the window should be destroyed when it is closed. |
| contentHeightCorrection | Defines the correction factor for computing the height of the contentWrapper. |
| title | Reference to the DOM node (TD) that contains the title. |
| content | Reference to the DOM node that represents the window content. |
| Functions | |
| init | Initializes the DOM tree that represents the window. |
| setTitle | Sets the window title to the given string. |
| setScrollable | Sets if the window contents should be scrollable. |
| activate | Puts the window on top of all other windows. |
| getElement | Returuns the outermost DOM node that makes up the window. |
| fit | Makes sure the window is inside the client area of the window. |
| isResizable | Returns true if the window is resizable. |
| setResizable | Sets if the window should be resizable. |
| setSize | Sets the size of the window. |
| setMinimizable | Sets if the window is minimizable. |
| getMinimumSize | Returns an mxRectangle that specifies the size for the minimized window. |
| installMinimizeHandler | Installs the event listeners required for minimizing the window. |
| setMaximizable | Sets if the window is maximizable. |
| installMaximizeHandler | Installs the event listeners required for maximizing the window. |
| installMoveHandler | Installs the event listeners required for moving the window. |
| setLocation | Sets the upper, left corner of the window. |
| getX | Returns the current position on the x-axis. |
| getY | Returns the current position on the y-axis. |
| installCloseHandler | Adds the closeImage as a new image node in <closeImg> and installs the <close> event. |
| setImage | Sets the image associated with the window. |
| setClosable | Sets the image associated with the window. |
| isVisible | Returns true if the window is visible. |
| setVisible | Shows or hides the window depending on the given flag. |
| show | Shows the window. |
| hide | Hides the window. |
| destroy | Destroys the window and removes all associated resources. |
| mxForm | A simple class for creating HTML forms. |
| Functions | |
| mxForm | Creates a HTML table using the specified classname. |
| Variables | |
| table | Holds the DOM node that represents the table. |
| body | Holds the DOM node that represents the tbody (table body). |
| Functions | |
| getTable | Returns the table that contains this form. |
| addButtons | Helper method to add an OK and Cancel button using the respective functions. |
| addText | Adds an input for the given name, type and value and returns it. |
| addCheckbox | Adds a checkbox for the given name and value and returns the textfield. |
| addTextarea | Adds a textarea for the given name and value and returns the textarea. |
| addCombo | Adds a combo for the given name and returns the combo. |
| addOption | Adds an option for the given label to the specified combo. |
| addField | Adds a new row with the name and the input field in two columns and returns the given input. |
| mxImage | Encapsulates the URL, width and height of an image. |
| Functions | |
| mxImage | Constructs a new image. |
| Variables | |
| src | String that specifies the URL of the image. |
| width | Integer that specifies the width of the image. |
| height | Integer that specifies the height of the image. |
| mxDivResizer | Maintains the size of a div element in Internet Explorer. |
| Functions | |
| mxDivResizer | Constructs an object that maintains the size of a div element when the window is being resized. |
| resizeWidth | Boolean specifying if the width should be updated. |
| resizeHeight | Boolean specifying if the height should be updated. |
| handlingResize | Boolean specifying if the width should be updated. |
| resize | Updates the style of the DIV after the window has been resized. |
| getDocumentWidth | Hook for subclassers to return the width of the document (without scrollbars). |
| getDocumentHeight | Hook for subclassers to return the height of the document (without scrollbars). |
| mxDragSource | Wrapper to create a drag source from a DOM element so that the element can be dragged over a graph and dropped into the graph as a new cell. |
| Functions | |
| mxDragSource | Constructs a new drag source for the given element. |
| Variables | |
| element | Reference to the DOM node which was made draggable. |
| dropHandler | Holds the DOM node that is used to represent the drag preview. |
| dragOffset | mxPoint that specifies the offset of the dragElement. |
| dragElement | Holds the DOM node that is used to represent the drag preview. |
| previewElement | Optional mxRectangle that specifies the unscaled size of the preview. |
| enabled | Specifies if this drag source is enabled. |
| currentGraph | Reference to the mxGraph that is the current drop target. |
| currentDropTarget | Holds the current drop target under the mouse. |
| currentPoint | Holds the current drop location. |
| currentGuide | Holds an mxGuide for the currentGraph if <dragPreview> is not null. |
| currentGuide | Holds an mxGuide for the currentGraph if <dragPreview> is not null. |
| autoscroll | Specifies if the graph should scroll automatically. |
| guidesEnabled | Specifies if mxGuide should be enabled. |
| gridEnabled | Specifies if the grid should be allowed. |
| highlightDropTargets | Specifies if drop targets should be highlighted. |
| dragElementZIndex | ZIndex for the drag element. |
| dragElementOpacity | Opacity of the drag element in %. |
| checkEventSource | Whether the event source should be checked in <graphContainerEvent>. |
| Functions | |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| isGuidesEnabled | Returns guidesEnabled. |
| setGuidesEnabled | Sets guidesEnabled. |
| isGridEnabled | Returns gridEnabled. |
| setGridEnabled | Sets gridEnabled. |
| getGraphForEvent | Returns the graph for the given mouse event. |
| getDropTarget | Returns the drop target for the given graph and coordinates. |
| createDragElement | Creates and returns a clone of the <dragElementPrototype> or the element if the former is not defined. |
| createPreviewElement | Creates and returns an element which can be used as a preview in the given graph. |
| isActive | Returns true if this drag source is active. |
| reset | Stops and removes everything and restores the state of the object. |
| mouseDown | Returns the drop target for the given graph and coordinates. |
| startDrag | Creates the dragElement using createDragElement. |
| stopDrag | Invokes removeDragElement. |
| removeDragElement | Removes and destroys the dragElement. |
| getElementForEvent | Returns the topmost element under the given event. |
| graphContainsEvent | Returns true if the given graph contains the given event. |
| mouseMove | Gets the graph for the given event using getGraphForEvent, updates the currentGraph, calling dragEnter and dragExit on the new and old graph, respectively, and invokes dragOver if currentGraph is not null. |
| mouseUp | Processes the mouse up event and invokes drop, dragExit and stopDrag as required. |
| removeListeners | Actives the given graph as a drop target. |
| dragEnter | Actives the given graph as a drop target. |
| dragExit | Deactivates the given graph as a drop target. |
| dragOver | Implements autoscroll, updates the currentPoint, highlights any drop targets and updates the preview. |
| drop | Returns the drop target for the given graph and coordinates. |
| mxToolbar | Creates a toolbar inside a given DOM node. |
| Events | |
| mxEvent. | Fires when an item was selected in the toolbar. |
| Functions | |
| mxToolbar | Constructs a toolbar in the specified container. |
| Variables | |
| container | Reference to the DOM nodes that contains the toolbar. |
| enabled | Specifies if events are handled. |
| noReset | Specifies if resetMode requires a forced flag of true for resetting the current mode in the toolbar. |
| updateDefaultMode | Boolean indicating if the default mode should be the last selected switch mode or the first inserted switch mode. |
| Functions | |
| addItem | Adds the given function as an image with the specified title and icon and returns the new image node. |
| addCombo | Adds and returns a new SELECT element using the given style. |
| addCombo | Adds and returns a new SELECT element using the given title as the default element. |
| addOption | Adds and returns a new OPTION element inside the given SELECT element. |
| addSwitchMode | Adds a new selectable item to the toolbar. |
| addMode | Adds a new item to the toolbar. |
| selectMode | Resets the state of the previously selected mode and displays the given DOM node as selected. |
| resetMode | Selects the default mode and resets the state of the previously selected mode. |
| addSeparator | Adds the specifies image as a separator. |
| addBreak | Adds a break to the container. |
| addLine | Adds a horizontal line to the container. |
| destroy | Removes the toolbar and all its associated resources. |
| mxUndoableEdit | Implements a composite undoable edit. |
| Events | |
| mxEvent. | Fires between START_EDIT and END_EDIT after an atomic change was executed. |
| mxEvent. | Fires before a set of changes will be executed in undo or redo. |
| mxEvent. | Fires after a set of changeswas executed in undo or redo. |
| Functions | |
| mxUndoableEdit | Constructs a new undoable edit for the given source. |
| Variables | |
| source | Specifies the source of the edit. |
| changes | Array that contains the changes that make up this edit. |
| significant | Specifies if the undoable change is significant. |
| undone | Specifies if this edit has been undone. |
| redone | Specifies if this edit has been redone. |
| Functions | |
| isEmpty | Returns true if the this edit contains no changes. |
| isSignificant | Returns significant. |
| add | Adds the specified change to this edit. |
| notify | Hook to notify any listeners of the changes after an undo or redo has been carried out. |
| die | Hook to free resources after the edit has been removed from the command history. |
| undo | Undoes all changes in this edit. |
| redo | Redoes all changes in this edit. |
| mxUndoManager | Implements a command history. |
| Events | |
| mxEvent. | Fires after clear was invoked. |
| mxEvent.UNDO | Fires afer a significant edit was undone in undo. |
| mxEvent.REDO | Fires afer a significant edit was redone in redo. |
| mxEvent.ADD | Fires after an undoable edit was added to the history. |
| Functions | |
| mxUndoManager | Constructs a new undo manager with the given history size. |
| Variables | |
| size | Maximum command history size. |
| history | Array that contains the steps of the command history. |
| indexOfNextAdd | Index of the element to be added next. |
| Functions | |
| isEmpty | Returns true if the history is empty. |
| clear | Clears the command history. |
| canUndo | Returns true if an undo is possible. |
| undo | Undoes the last change. |
| canRedo | Returns true if a redo is possible. |
| redo | Redoes the last change. |
| undoableEditHappened | Method to be called to add new undoable edits to the history. |
| trim | Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit. |
| mxUrlConverter | Converts relative and absolute URLs to absolute URLs with protocol and domain. |
| Variables | |
| enabled | Specifies if the converter is enabled. |
| baseUrl | Specifies the base URL to be used as a prefix for relative URLs. |
| baseDomain | Specifies the base domain to be used as a prefix for absolute URLs. |
| Functions | |
| updateBaseUrl | Private helper function to update the base URL. |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| getBaseUrl | Returns baseUrl. |
| setBaseUrl | Sets baseUrl. |
| getBaseDomain | Returns baseDomain. |
| setBaseDomain | Sets baseDomain. |
| isRelativeUrl | Returns true if the given URL is relative. |
| convert | Converts the given URL to an absolute URL with protol and domain. |
| mxPanningManager | Implements a handler for panning. |
| Variables | |
| damper | Damper value for the panning. |
| delay | Delay in milliseconds for the panning. |
| handleMouseOut | Specifies if mouse events outside of the component should be handled. |
| border | Border to handle automatic panning inside the component. |
| mxPopupMenu | Basic popup menu. |
| Functions | |
| mxPopupMenu | Constructs a popupmenu. |
| Events | |
| mxEvent.SHOW | Fires after the menu has been shown in popup. |
| Variables | |
| submenuImage | URL of the image to be used for the submenu icon. |
| zIndex | Specifies the zIndex for the popupmenu and its shadow. |
| factoryMethod | Function that is used to create the popup menu. |
| useLeftButtonForPopup | Specifies if popupmenus should be activated by clicking the left mouse button. |
| enabled | Specifies if events are handled. |
| itemCount | Contains the number of times addItem has been called for a new menu. |
| autoExpand | Specifies if submenus should be expanded on mouseover. |
| smartSeparators | Specifies if separators should only be added if a menu item follows them. |
| labels | Specifies if any labels should be visible. |
| Functions | |
| init | Initializes the shapes required for this vertex handler. |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isPopupTrigger | Returns true if the given event is a popupmenu trigger for the optional given cell. |
| addItem | Adds the given item to the given parent item. |
| createSubmenu | Creates the nodes required to add submenu items inside the given parent item. |
| showSubmenu | Shows the submenu inside the given parent row. |
| addSeparator | Adds a horizontal separator in the given parent item or the top-level menu if no parent is specified. |
| popup | Shows the popup menu for the given event and cell. |
| isMenuShowing | Returns true if the menu is showing. |
| showMenu | Shows the menu. |
| hideMenu | Removes the menu and all submenus. |
| hideSubmenu | Removes all submenus inside the given parent. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxAutoSaveManager | Manager for automatically saving diagrams. |
| Functions | |
| mxAutoSaveManager | Constructs a new automatic layout for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| autoSaveDelay | Minimum amount of seconds between two consecutive autosaves. |
| autoSaveThrottle | Minimum amount of seconds between two consecutive autosaves triggered by more than <autoSaveThreshhold> changes within a timespan of less than autoSaveDelay seconds. |
| autoSaveThreshold | Minimum amount of ignored changes before an autosave. |
| ignoredChanges | Counter for ignored changes in autosave. |
| lastSnapshot | Used for autosaving. |
| enabled | Specifies if event handling is enabled. |
| changeHandler | Holds the function that handles graph model changes. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| setGraph | Sets the graph that the layouts operate on. |
| save | Empty hook that is called if the graph should be saved. |
| graphModelChanged | Invoked when the graph model has changed. |
| reset | Resets all counters. |
| destroy | Removes all handlers from the graph and deletes the reference to it. |
| mxAnimation | Implements a basic animation in JavaScript. |
| Functions | |
| mxAnimation | Constructs an animation. |
| Variables | |
| delay | Specifies the delay between the animation steps. |
| thread | Reference to the thread while the animation is running. |
| Functions | |
| isRunning | Returns true if the animation is running. |
| startAnimation | Starts the animation by repeatedly invoking updateAnimation. |
| updateAnimation | Hook for subclassers to implement the animation. |
| stopAnimation | Stops the animation by deleting the timer and fires an mxEvent.DONE. |
| mxMorphing | Implements animation for morphing cells. |
| Functions | |
| mxMorphing | Constructs an animation. |
| Variables | |
| graph | Specifies the delay between the animation steps. |
| steps | Specifies the maximum number of steps for the morphing. |
| step | Contains the current step. |
| ease | Ease-off for movement towards the given vector. |
| cells | Optional array of cells to be animated. |
| Functions | |
| updateAnimation | Animation step. |
| show | Shows the changes in the given mxCellStatePreview. |
| animateCell | Animates the given cell state using mxCellStatePreview.moveState. |
| stopRecursion | Returns true if the animation should not recursively find more deltas for children if the given parent state has been animated. |
| getDelta | Returns the vector between the current rendered state and the future location of the state after the display will be updated. |
| getOriginForCell | Returns the top, left corner of the given cell. |
| mxImageBundle | Maps from keys to base64 encoded images or file locations. |
| Variables | |
| images | Maps from keys to images. |
| alt | Specifies if the fallback representation should be returned. |
| Functions | |
| putImage | Adds the specified entry to the map. |
| getImage | Returns the value for the given key. |
| mxImageExport | Creates a new image export instance to be used with an export canvas. |
| Functions | |
| mxImageExport | Constructs a new image export. |
| Variables | |
| includeOverlays | Specifies if overlays should be included in the export. |
| Functions | |
| drawState | Draws the given state and all its descendants to the given canvas. |
| drawState | Draws the given state and all its descendants to the given canvas. |
| getLinkForCellState | Returns the link for the given cell state and canvas. |
| drawCellState | Draws the given state to the given canvas. |
| drawShape | Draws the shape of the given state. |
| drawText | Draws the text of the given state. |
| drawOverlays | Draws the overlays for the given state. |
| mxAbstractCanvas2D | Base class for all canvases. |
| Functions | |
| mxAbstractCanvas2D | Constructs a new abstract canvas. |
| Variables | |
| converter | Holds the mxUrlConverter to convert image URLs. |
| state | Holds the current state. |
| states | Stack of states. |
| path | Holds the current path as an array. |
| rotateHtml | Switch for rotation of HTML. |
| lastX | Holds the last x coordinate. |
| lastY | Holds the last y coordinate. |
| moveOp | Contains the string used for moving in paths. |
| lineOp | Contains the string used for moving in paths. |
| quadOp | Contains the string used for quadratic paths. |
| curveOp | Contains the string used for bezier curves. |
| closeOp | Holds the operator for closing curves. |
| pointerEvents | Boolean value that specifies if events should be handled. |
| Functions | |
| createUrlConverter | Create a new mxUrlConverter and returns it. |
| reset | Resets the state of this canvas. |
| createState | Creates the state of the this canvas. |
| format | Rounds all numbers to integers. |
| addOp | Adds the given operation to the path. |
| rotatePoint | Rotates the given point and returns the result as an mxPoint. |
| save | Saves the current state. |
| restore | Restores the current state. |
| setLink | Sets the current link. |
| scale | Scales the current state. |
| translate | Translates the current state. |
| rotate | Rotates the current state. |
| setAlpha | Sets the current alpha. |
| setFillAlpha | Sets the current solid fill alpha. |
| setStrokeAlpha | Sets the current stroke alpha. |
| setFillColor | Sets the current fill color. |
| setGradient | Sets the current gradient. |
| setStrokeColor | Sets the current stroke color. |
| setStrokeWidth | Sets the current stroke width. |
| setDashed | Enables or disables dashed lines. |
| setDashPattern | Sets the current dash pattern. |
| setLineCap | Sets the current line cap. |
| setLineJoin | Sets the current line join. |
| setMiterLimit | Sets the current miter limit. |
| setFontColor | Sets the current font color. |
| setFontColor | Sets the current font color. |
| setFontColor | Sets the current font color. |
| setFontSize | Sets the current font size. |
| setFontFamily | Sets the current font family. |
| setFontStyle | Sets the current font style. |
| setShadow | Enables or disables and configures the current shadow. |
| setShadowColor | Enables or disables and configures the current shadow. |
| setShadowAlpha | Enables or disables and configures the current shadow. |
| setShadowOffset | Enables or disables and configures the current shadow. |
| begin | Starts a new path. |
| moveTo | Moves the current path the given coordinates. |
| lineTo | Draws a line to the given coordinates. |
| quadTo | Adds a quadratic curve to the current path. |
| curveTo | Adds a bezier curve to the current path. |
| arcTo | Adds the given arc to the current path. |
| close | Closes the current path. |
| end | Empty implementation for backwards compatibility. |
| mxXmlCanvas2D | Base class for all canvases. |
| Functions | |
| mxXmlCanvas2D | Constructs a new abstract canvas. |
| Variables | |
| root | Reference to the container for the SVG content. |
| textEnabled | Specifies if text output should be enabled. |
| compressed | Specifies if the output should be compressed by removing redundant calls. |
| Functions | |
| writeDefaults | |
| format | Returns a formatted number with 2 decimal places. |
| createElement | Creates the given element using the owner document of root. |
| save | Saves the drawing state. |
| restore | Restores the drawing state. |
| scale | Scales the output. |
| translate | Translates the output. |
| rotate | Rotates and/or flips the output around a given center. |
| setAlpha | Sets the current alpha. |
| setFillAlpha | Sets the current fill alpha. |
| setStrokeAlpha | Sets the current stroke alpha. |
| setFillColor | Sets the current fill color. |
| setGradient | Sets the gradient. |
| setStrokeColor | Sets the current stroke color. |
| setStrokeWidth | Sets the current stroke width. |
| setDashed | Enables or disables dashed lines. |
| setDashPattern | Sets the current dash pattern. |
| setLineCap | Sets the line cap. |
| setLineJoin | Sets the line join. |
| setMiterLimit | Sets the miter limit. |
| setFontColor | Sets the current font color. |
| setFontBackgroundColor | Sets the current font background color. |
| setFontBorderColor | Sets the current font border color. |
| setFontSize | Sets the current font size. |
| setFontFamily | Sets the current font family. |
| setFontStyle | Sets the current font style. |
| setShadow | Enables or disables shadows. |
| setShadowColor | Sets the current shadow color. |
| setShadowAlpha | Sets the current shadows alpha. |
| setShadowOffset | Sets the current shadow offset. |
| rect | Puts a rectangle into the drawing buffer. |
| roundrect | Puts a rounded rectangle into the drawing buffer. |
| ellipse | Puts an ellipse into the drawing buffer. |
| image | Paints an image. |
| begin | Starts a new path and puts it into the drawing buffer. |
| moveTo | Moves the current path the given point. |
| lineTo | Draws a line to the given coordinates. |
| quadTo | Adds a quadratic curve to the current path. |
| curveTo | Adds a bezier curve to the current path. |
| close | Closes the current path. |
| text | Paints the given text. |
| stroke | Paints the outline of the current drawing buffer. |
| fill | Fills the current drawing buffer. |
| fillAndStroke | Fills the current drawing buffer and its outline. |
| mxSvgCanvas2D | Extends mxAbstractCanvas2D to implement a canvas for SVG. |
| Functions | |
| mxSvgCanvas2D | Constructs a new SVG canvas. |
| Variables | |
| root | Reference to the container for the SVG content. |
| gradients | Local cache of gradients for quick lookups. |
| defs | Reference to the defs section of the SVG document. |
| styleEnabled | Stores the value of styleEnabled passed to the constructor. |
| path | Holds the current DOM node. |
| matchHtmlAlignment | Specifies if plain text output should match the vertical HTML alignment. |
| textEnabled | Specifies if text output should be enabled. |
| foEnabled | Specifies if use of foreignObject for HTML markup is allowed. |
| foAltText | Specifies the fallback text for unsupported foreignObjects in exported documents. |
| foOffset | Offset to be used for foreignObjects. |
| textOffset | Offset to be used for text elements. |
| imageOffset | Offset to be used for image elements. |
| strokeTolerance | Adds transparent paths for strokes. |
| minStrokeWidth | Minimum stroke width for output. |
| refCount | Local counter for references in SVG export. |
| blockImagePointerEvents | Specifies if a transparent rectangle should be added on top of images to absorb all pointer events. |
| lineHeightCorrection | Correction factor for mxConstants.LINE_HEIGHT in HTML output. |
| pointerEventsValue | Default value for active pointer events. |
| fontMetricsPadding | Padding to be added for text that is not wrapped to account for differences in font metrics on different platforms in pixels. |
| cacheOffsetSize | Specifies if offsetWidth and offsetHeight should be cached. |
| Functions | |
| format | Rounds all numbers to 2 decimal points. |
| getBaseUrl | Returns the URL of the page without the hash part. |
| reset | Returns any offsets for rendering pixels. |
| createStyle | Creates the optional style section. |
| createElement | Private helper function to create SVG elements |
| getAlternateContent | Returns the alternate content for the given foreignObject. |
| createGradientId | Private helper function to create SVG elements |
| getSvgGradient | Private helper function to create SVG elements |
| createSvgGradient | Creates the given SVG gradient. |
| addNode | Private helper function to create SVG elements |
| updateFill | Transfers the stroke attributes from <state> to <node>. |
| getCurrentStrokeWidth | Returns the current stroke width (>= 1), ie. |
| updateStroke | Transfers the stroke attributes from <state> to <node>. |
| updateStrokeAttributes | Transfers the stroke attributes from <state> to <node>. |
| createDashPattern | Creates the SVG dash pattern for the given state. |
| createTolerance | Creates a hit detection tolerance shape for the given node. |
| createShadow | Creates a shadow for the given node. |
| setLink | Experimental implementation for hyperlinks. |
| rotate | Sets the rotation of the canvas. |
| begin | Extends superclass to create path. |
| rect | Private helper function to create SVG elements |
| roundrect | Private helper function to create SVG elements |
| ellipse | Private helper function to create SVG elements |
| image | Private helper function to create SVG elements |
| convertHtml | Converts the given HTML string to XHTML. |
| createDiv | Private helper function to create SVG elements |
| text | Paints the given text. |
| createClip | Creates a clip for the given coordinates. |
| text | Paints the given text. |
| updateFont | Updates the text properties for the given node. |
| addTextBackground | Background color and border |
| stroke | Paints the outline of the current path. |
| fill | Fills the current path. |
| fillAndStroke | Fills and paints the outline of the current path. |
| mxVmlCanvas2D | Implements a canvas to be used for rendering VML. |
| Variables | |
| root | Reference to the container for the SVG content. |
| path | Holds the current DOM node. |
| textEnabled | Specifies if text output should be enabledetB. |
| moveOp | Contains the string used for moving in paths. |
| lineOp | Contains the string used for moving in paths. |
| curveOp | Contains the string used for bezier curves. |
| closeOp | Holds the operator for closing curves. |
| rotatedHtmlBackground | Background color for rotated HTML. |
| vmlScale | Specifies the scale used to draw VML shapes. |
| Functions | |
| createElement | Creates the given element using the document. |
| createVmlElement | Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX. |
| addNode | Adds the current node to the root. |
| createTransparentFill | Creates a transparent fill. |
| createFill | Creates a fill for the current state. |
| createStroke | Creates a fill for the current state. |
| getVmlDashPattern | Returns a VML dash pattern for the current dashPattern. |
| createShadow | Creates a shadow for the given node. |
| createShadowFill | Creates the fill for the shadow. |
| createShadowStroke | Creates the stroke for the shadow. |
| rotate | Sets the rotation of the canvas. |
| begin | Extends superclass to create path. |
| quadTo | Replaces quadratic curve with bezier curve in VML. |
| createRect | Sets the glass gradient. |
| rect | Sets the current path to a rectangle. |
| roundrect | Sets the current path to a rounded rectangle. |
| ellipse | Sets the current path to an ellipse. |
| image | Paints an image. |
| createText | Creates the innermost element that contains the HTML text. |
| text | Paints the given text. |
| plainText | Paints the outline of the current path. |
| stroke | Paints the outline of the current path. |
| fill | Fills the current path. |
| fillAndStroke | Fills and paints the outline of the current path. |
| mxGuide | Implements the alignment of selection cells to other cells in the graph. |
| Functions | |
| mxGuide | Constructs a new guide object. |
| Variables | |
| graph | Reference to the enclosing mxGraph instance. |
| states | Contains the mxCellStates that are used for alignment. |
| horizontal | Specifies if horizontal guides are enabled. |
| vertical | Specifies if vertical guides are enabled. |
| vertical | Holds the mxShape for the horizontal guide. |
| vertical | Holds the mxShape for the vertical guide. |
| rounded | Specifies if rounded coordinates should be used. |
| Functions | |
| setStates | Sets the mxCellStates that should be used for alignment. |
| isEnabledForEvent | Returns true if the guide should be enabled for the given native event. |
| getGuideTolerance | Returns the tolerance for the guides. |
| createGuideShape | Returns the mxShape to be used for painting the respective guide. |
| move | Moves the <bounds> by the given mxPoint and returnt the snapped point. |
| hide | Hides all current guides. |
| hide | Hides all current guides. |
| hide | Hides all current guides. |
| setVisible | Shows or hides the current guides. |
| destroy | Destroys all resources that this object uses. |
| mxShape | Base class for all shapes. |
| Functions | |
| mxShape | Constructs a new shape. |
| Variables | |
| dialect | Holds the dialect in which the shape is to be painted. |
| scale | Holds the scale in which the shape is being painted. |
| antiAlias | Rendering hint for configuring the canvas. |
| minSvgStrokeWidth | Minimum stroke width for SVG output. |
| bounds | Holds the mxRectangle that specifies the bounds of this shape. |
| points | Holds the array of mxPoints that specify the points of this shape. |
| node | Holds the outermost DOM node that represents this shape. |
| state | Optional reference to the corresponding mxCellState. |
| style | Optional reference to the style of the corresponding mxCellState. |
| boundingBox | Contains the bounding box of the shape, that is, the smallest rectangle that includes all pixels of the shape. |
| stencil | Holds the mxStencil that defines the shape. |
| svgStrokeTolerance | Event-tolerance for SVG strokes (in px). |
| pointerEvents | Specifies if pointer events should be handled. |
| svgPointerEvents | Specifies if pointer events should be handled. |
| shapePointerEvents | Specifies if pointer events outside of shape should be handled. |
| stencilPointerEvents | Specifies if pointer events outside of stencils should be handled. |
| vmlScale | Scale for improving the precision of VML rendering. |
| outline | Specifies if the shape should be drawn as an outline. |
| visible | Specifies if the shape is visible. |
| useSvgBoundingBox | Allows to use the SVG bounding box in SVG. |
| Functions | |
| init | Initializes the shape by creaing the DOM node using create and adding it into the given container. |
| initStyles | Sets the styles to their default values. |
| isParseVml | Specifies if any VML should be added via insertAdjacentHtml to the DOM. |
| isHtmlAllowed | Returns true if HTML is allowed for this shape. |
| getSvgScreenOffset | Returns 0, or 0.5 if <strokewidth> % 2 == 1. |
| create | Creates and returns the DOM node(s) for the shape in the given container. |
| createSvg | Creates and returns the SVG node(s) to represent this shape. |
| createVml | Creates and returns the VML node to represent this shape. |
| createHtml | Creates and returns the HTML DOM node(s) to represent this shape. |
| reconfigure | Reconfigures this shape. |
| redraw | Creates and returns the SVG node(s) to represent this shape. |
| clear | Removes all child nodes and resets all CSS. |
| updateBoundsFromPoints | Updates the bounds based on the points. |
| getLabelBounds | Returns the mxRectangle for the label bounds of this shape, based on the given scaled and translated bounds of the shape. |
| getLabelMargins | Returns the scaled top, left, bottom and right margin to be used for computing the label bounds as an mxRectangle, where the bottom and right margin are defined in the width and height of the rectangle, respectively. |
| checkBounds | Returns true if the bounds are not null and all of its variables are numeric. |
| createVmlGroup | Returns the temporary element used for rendering in IE8 standards mode. |
| redrawShape | Updates the SVG or VML shape. |
| createCanvas | Creates a new canvas for drawing this shape. |
| createSvgCanvas | Creates and returns an mxSvgCanvas2D for rendering this shape. |
| createVmlCanvas | Creates and returns an mxVmlCanvas2D for rendering this shape. |
| updateVmlContainer | Updates the bounds of the VML container. |
| redrawHtml | Allow optimization by replacing VML with HTML. |
| updateHtmlFilters | Allow optimization by replacing VML with HTML. |
| mixedModeHtml | Allow optimization by replacing VML with HTML. |
| mixedModeHtml | Allow optimization by replacing VML with HTML. |
| destroyCanvas | Destroys the given canvas which was used for drawing. |
| paint | Generic rendering code. |
| configureCanvas | Sets the state of the canvas for drawing the shape. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| updateTransform | Sets the scale and rotation on the given canvas. |
| paintVertexShape | Paints the vertex shape. |
| paintBackground | Hook for subclassers. |
| paintForeground | Hook for subclassers. |
| paintEdgeShape | Hook for subclassers. |
| getArcSize | Returns the arc size for the given dimension. |
| paintGlassEffect | Paints the glass gradient effect. |
| addPoints | Paints the given points with rounded corners. |
| resetStyles | Resets all styles. |
| apply | Applies the style of the given mxCellState to the shape. |
| setCursor | Sets the cursor on the given shape. |
| getCursor | Returns the current cursor. |
| isRoundable | Hook for subclassers. |
| updateBoundingBox | Updates the boundingBox for this shape using createBoundingBox and augmentBoundingBox and stores the result in boundingBox. |
| createBoundingBox | Returns a new rectangle that represents the bounding box of the bare shape with no shadows or strokewidths. |
| augmentBoundingBox | Augments the bounding box with the strokewidth and shadow offsets. |
| isPaintBoundsInverted | Returns true if the bounds should be inverted. |
| getRotation | Returns the rotation from the style. |
| getTextRotation | Returns the rotation for the text label. |
| getShapeRotation | Returns the actual rotation of the shape. |
| createTransparentSvgRectangle | Adds a transparent rectangle that catches all events. |
| setTransparentBackgroundImage | Sets a transparent background CSS style to catch all events. |
| releaseSvgGradients | Paints the line shape. |
| destroy | Destroys the shape by removing it from the DOM and releasing the DOM node associated with the shape using mxEvent.release. |
| mxStencil | Implements a generic shape which is based on a XML node as a description. |
| Functions | |
| mxStencil | Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints. |
| Variables | |
| defaultLocalized | Static global variable that specifies the default value for the localized attribute of the text element. |
| Functions | |
| allowEval | Static global switch that specifies if the use of eval is allowed for evaluating text content and images. |
| Variables | |
| desc | Holds the XML node with the stencil description. |
| constraints | Holds an array of mxConnectionConstraints as defined in the shape. |
| aspect | Holds the aspect of the shape. |
| w0 | Holds the width of the shape. |
| h0 | Holds the height of the shape. |
| bgNodes | Holds the XML node with the stencil description. |
| fgNodes | Holds the XML node with the stencil description. |
| strokewidth | Holds the strokewidth direction from the description. |
| Functions | |
| parseDescription | Reads w0, h0, aspect, bgNodes and fgNodes from desc. |
| parseConstraints | Reads the constraints from desc into constraints using parseConstraint. |
| parseConstraint | Parses the given XML node and returns its mxConnectionConstraint. |
| evaluateTextAttribute | Gets the given attribute as a text. |
| evaluateAttribute | Gets the attribute for the given name from the given node. |
| drawShape | Draws this stencil inside the given bounds. |
| drawChildren | Draws this stencil inside the given bounds. |
| computeAspect | Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle. |
| drawNode | Draws this stencil inside the given bounds. |
| mxStencilRegistry | A singleton class that provides a registry for stencils and the methods for painting those stencils onto a canvas or into a DOM. |
| Functions | |
| addStencil | Adds the given mxStencil. |
| getStencil | Returns the mxStencil for the given name. |
| mxMarker | A static class that implements all markers for VML and SVG using a registry. |
| Variables | |
| markers | Maps from markers names to functions to paint the markers. |
| Functions | |
| addMarker | Adds a factory method that updates a given endpoint and returns a function to paint the marker onto the given canvas. |
| createMarker | Returns a function to paint the given marker. |
| mxActor | Extends mxShape to implement an actor shape. |
| Functions | |
| mxActor | Constructs a new actor shape. |
| paintVertexShape | Redirects to redrawPath for subclasses to work. |
| redrawPath | Draws the path for this shape. |
| mxCloud | Extends mxActor to implement a cloud shape. |
| Functions | |
| mxCloud | Constructs a new cloud shape. |
| redrawPath | Draws the path for this shape. |
| mxRectangleShape | Extends mxShape to implement a rectangle shape. |
| Functions | |
| mxRectangleShape | Constructs a new rectangle shape. |
| isHtmlAllowed | Returns true for non-rounded, non-rotated shapes with no glass gradient. |
| paintBackground | Generic background painting implementation. |
| isRoundable | Adds roundable support. |
| paintForeground | Generic background painting implementation. |
| mxEllipse | Extends mxShape to implement an ellipse shape. |
| Functions | |
| mxEllipse | Constructs a new ellipse shape. |
| paintVertexShape | Paints the ellipse shape. |
| mxDoubleEllipse | Extends mxShape to implement a double ellipse shape. |
| Functions | |
| mxDoubleEllipse | Constructs a new ellipse shape. |
| Variables | |
| vmlScale | Scale for improving the precision of VML rendering. |
| Functions | |
| paintBackground | Paints the background. |
| paintForeground | Paints the foreground. |
| getLabelBounds | Returns the bounds for the label. |
| mxRhombus | Extends mxShape to implement a rhombus (aka diamond) shape. |
| Functions | |
| mxRhombus | Constructs a new rhombus shape. |
| isRoundable | Adds roundable support. |
| paintVertexShape | Generic painting implementation. |
| mxPolyline | Extends mxShape to implement a polyline (a line with multiple points). |
| Functions | |
| mxPolyline | Constructs a new polyline shape. |
| getRotation | Returns 0. |
| getShapeRotation | Returns 0. |
| isPaintBoundsInverted | Returns false. |
| paintEdgeShape | Paints the line shape. |
| paintLine | Paints the line shape. |
| paintLine | Paints the line shape. |
| mxArrow | Extends mxShape to implement an arrow shape. |
| Functions | |
| mxArrow | Constructs a new arrow shape. |
| augmentBoundingBox | Augments the bounding box with the edge width and markers. |
| paintEdgeShape | Paints the line shape. |
| mxArrowConnector | Extends mxShape to implement an new rounded arrow shape with support for waypoints and double arrows. |
| Functions | |
| mxArrowConnector | Constructs a new arrow shape. |
| Variables | |
| useSvgBoundingBox | Allows to use the SVG bounding box in SVG. |
| resetStyles | Overrides mxShape to reset spacing. |
| Functions | |
| augmentBoundingBox | Augments the bounding box with the edge width and markers. |
| paintEdgeShape | Paints the line shape. |
| paintEdgeShape | Paints the line shape. |
| isArrowRounded | Returns wether the arrow is rounded |
| getStartArrowWidth | Returns the width of the start arrow |
| getEndArrowWidth | Returns the width of the end arrow |
| getEdgeWidth | Returns the width of the body of the edge |
| isOpenEnded | Returns whether the ends of the shape are drawn |
| isMarkerStart | Returns whether the start marker is drawn |
| isMarkerEnd | Returns whether the end marker is drawn |
| mxText | Extends mxShape to implement a text shape. |
| Functions | |
| mxText | Constructs a new text shape. |
| Variables | |
| baseSpacingTop | Specifies the spacing to be added to the top spacing. |
| baseSpacingBottom | Specifies the spacing to be added to the bottom spacing. |
| baseSpacingLeft | Specifies the spacing to be added to the left spacing. |
| baseSpacingRight | Specifies the spacing to be added to the right spacing. |
| replaceLinefeeds | Specifies if linefeeds in HTML labels should be replaced with BR tags. |
| verticalTextRotation | Rotation for vertical text. |
| ignoreClippedStringSize | Specifies if the string size should be measured in updateBoundingBox if the label is clipped and the label position is center and middle. |
| ignoreStringSize | Specifies if the actual string size should be measured. |
| textWidthPadding | Specifies the padding to be added to the text width for the bounding box. |
| lastValue | Contains the last rendered text value. |
| cacheEnabled | Specifies if caching for HTML labels should be enabled. |
| Functions | |
| isParseVml | Text shapes do not contain VML markup and do not need to be parsed. |
| isHtmlAllowed | Returns true if HTML is allowed for this shape. |
| getSvgScreenOffset | Disables offset in IE9 for crisper image output. |
| checkBounds | Returns true if the bounds are not null and all of its variables are numeric. |
| paint | Generic rendering code. |
| redraw | Renders the text using the given DOM nodes. |
| resetStyles | Resets all styles. |
| apply | Extends mxShape to update the text styles. |
| getAutoDirection | Used to determine the automatic text direction. |
| updateBoundingBox | Updates the <boundingBox> for this shape using the given node and position. |
| getShapeRotation | Returns 0 to avoid using rotation in the canvas via updateTransform. |
| getTextRotation | Returns the rotation for the text label of the corresponding shape. |
| isPaintBoundsInverted | Inverts the bounds if <mxShape.isBoundsInverted> returns true or if the horizontal style is false. |
| configureCanvas | Sets the state of the canvas for drawing the shape. |
| updateVmlContainer | Sets the width and height of the container to 1px. |
| redrawHtmlShape | Updates the HTML node(s) to reflect the latest bounds and scale. |
| updateHtmlTransform | Returns the spacing as an mxPoint. |
| setInnerHtml | Sets the inner HTML of the given element to the <value>. |
| updateHtmlFilter | Rotated text rendering quality is bad for IE9 quirks/IE8 standards |
| updateValue | Updates the HTML node(s) to reflect the latest bounds and scale. |
| updateFont | Updates the HTML node(s) to reflect the latest bounds and scale. |
| updateSize | Updates the HTML node(s) to reflect the latest bounds and scale. |
| getMargin | Returns the spacing as an mxPoint. |
| getSpacing | Returns the spacing as an mxPoint. |
| mxTriangle | Implementation of the triangle shape. |
| Functions | |
| mxTriangle | Constructs a new triangle shape. |
| isRoundable | Adds roundable support. |
| redrawPath | Draws the path for this shape. |
| mxHexagon | Implementation of the hexagon shape. |
| Functions | |
| mxHexagon | Constructs a new hexagon shape. |
| redrawPath | Draws the path for this shape. |
| mxLine | Extends mxShape to implement a horizontal line shape. |
| Functions | |
| mxLine | Constructs a new line shape. |
| paintVertexShape | Redirects to redrawPath for subclasses to work. |
| mxImageShape | Extends mxShape to implement an image shape. |
| Functions | |
| mxImageShape | Constructs a new image shape. |
| Variables | |
| preserveImageAspect | Switch to preserve image aspect. |
| Functions | |
| getSvgScreenOffset | Disables offset in IE9 for crisper image output. |
| apply | Overrides mxShape.apply to replace the fill and stroke colors with the respective values from mxConstants.STYLE_IMAGE_BACKGROUND and mxConstants.STYLE_IMAGE_BORDER. |
| isHtmlAllowed | Returns true if HTML is allowed for this shape. |
| createHtml | Creates and returns the HTML DOM node(s) to represent this shape. |
| isRoundable | Disables inherited roundable support. |
| paintVertexShape | Generic background painting implementation. |
| redraw | Overrides mxShape.redraw to preserve the aspect ratio of images. |
| mxLabel | Extends mxShape to implement an image shape with a label. |
| Functions | |
| mxLabel | Constructs a new label shape. |
| Variables | |
| imageSize | Default width and height for the image. |
| spacing | Default value for image spacing. |
| indicatorSize | Default width and height for the indicicator. |
| indicatorSpacing | Default spacing between image and indicator. |
| Functions | |
| init | Initializes the shape and the <indicator>. |
| redraw | Reconfigures this shape. |
| isHtmlAllowed | Returns true for non-rounded, non-rotated shapes with no glass gradient and no indicator shape. |
| paintForeground | Generic background painting implementation. |
| paintImage | Generic background painting implementation. |
| getImageBounds | Generic background painting implementation. |
| paintIndicator | Generic background painting implementation. |
| getIndicatorBounds | Generic background painting implementation. |
| redrawHtmlShape | Generic background painting implementation. |
| mxCylinder | Extends mxShape to implement an cylinder shape. |
| Functions | |
| mxCylinder | Constructs a new cylinder shape. |
| Variables | |
| maxHeight | Defines the maximum height of the top and bottom part of the cylinder shape. |
| svgStrokeTolerance | Sets stroke tolerance to 0 for SVG. |
| Functions | |
| paintVertexShape | Redirects to redrawPath for subclasses to work. |
| redrawPath | Draws the path for this shape. |
| redrawPath | Draws the path for this shape. |
| mxConnector | Extends mxShape to implement a connector shape. |
| Functions | |
| mxConnector | Constructs a new connector shape. |
| updateBoundingBox | Updates the <boundingBox> for this shape using <createBoundingBox> and augmentBoundingBox and stores the result in <boundingBox>. |
| paintEdgeShape | Paints the line shape. |
| createMarker | Prepares the marker by adding offsets in pts and returning a function to paint the marker. |
| augmentBoundingBox | Augments the bounding box with the strokewidth and shadow offsets. |
| mxSwimlane | Extends mxShape to implement a swimlane shape. |
| Functions | |
| mxSwimlane | Constructs a new swimlane shape. |
| Variables | |
| imageSize | Default imagewidth and imageheight if an image but no imagewidth and imageheight are defined in the style. |
| Functions | |
| isRoundable | Adds roundable support. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| getArcSize | Returns the arcsize for the swimlane. |
| paintVertexShape | Paints the swimlane vertex shape. |
| paintVertexShape | Paints the swimlane vertex shape. |
| paintSwimlane | Paints the swimlane vertex shape. |
| paintRoundedSwimlane | Paints the swimlane vertex shape. |
| paintDivider | Paints the divider between swimlane title and content area. |
| paintSeparator | Paints the vertical or horizontal separator line between swimlanes. |
| getImageBounds | Paints the swimlane vertex shape. |
| mxGraphLayout | Base class for all layout algorithms in mxGraph. |
| Functions | |
| mxGraphLayout | Constructs a new layout using the given layouts. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| useBoundingBox | Boolean indicating if the bounding box of the label should be used if its available. |
| parent | The parent cell of the layout, if any |
| Functions | |
| moveCell | Notified when a cell is being moved in a parent that has automatic layout to update the cell state (eg. |
| execute | Executes the layout algorithm for the children of the given parent. |
| getGraph | Returns the graph that this layout operates on. |
| getConstraint | Returns the constraint for the given key and cell. |
| traverse | Traverses the (directed) graph invoking the given function for each visited vertex and edge. |
| isAncestor | Returns true if the given parent is an ancestor of the given child. |
| isVertexMovable | Returns a boolean indicating if the given mxCell is movable or bendable by the algorithm. |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored by the algorithm. |
| isEdgeIgnored | Returns a boolean indicating if the given mxCell should be ignored by the algorithm. |
| setEdgeStyleEnabled | Disables or enables the edge style of the given edge. |
| setOrthogonalEdge | Disables or enables orthogonal end segments of the given edge. |
| getParentOffset | Determines the offset of the given parent to the parent of the layout |
| setEdgePoints | Replaces the array of mxPoints in the geometry of the given edge with the given array of mxPoints. |
| setVertexLocation | Sets the new position of the given cell taking into account the size of the bounding box if useBoundingBox is true. |
| getVertexBounds | Returns an mxRectangle that defines the bounds of the given cell or the bounding box if useBoundingBox is true. |
| arrangeGroups | Shortcut to mxGraph.updateGroupBounds with moveGroup set to true. |
| WeightedCellSorter | A utility class used to track cells whilst sorting occurs on the weighted sum of their connected edges. |
| Functions | |
| WeightedCellSorter | Constructs a new weighted cell sorted for the given cell and weight. |
| Variables | |
| weightedValue | The weighted value of the cell stored. |
| nudge | Whether or not to flip equal weight values. |
| visited | Whether or not this cell has been visited in the current assignment. |
| rankIndex | The index this cell is in the model rank. |
| cell | The cell whose median value is being calculated. |
| Functions | |
| compare | Compares two WeightedCellSorters. |
| mxStackLayout | Extends mxGraphLayout to create a horizontal or vertical stack of the child vertices. |
| Functions | |
| mxStackLayout | Constructs a new stack layout layout for the specified graph, spacing, orientation and offset. |
| Variables | |
| horizontal | Specifies the orientation of the layout. |
| spacing | Specifies the spacing between the cells. |
| x0 | Specifies the horizontal origin of the layout. |
| y0 | Specifies the vertical origin of the layout. |
| border | Border to be added if fill is true. |
| marginTop | Top margin for the child area. |
| marginLeft | Top margin for the child area. |
| marginRight | Top margin for the child area. |
| marginBottom | Top margin for the child area. |
| keepFirstLocation | Boolean indicating if the location of the first cell should be kept, that is, it will not be moved to x0 or y0. |
| fill | Boolean indicating if dimension should be changed to fill out the parent cell. |
| resizeParent | If the parent should be resized to match the width/height of the stack. |
| resizeParentMax | Use maximum of existing value and new value for resize of parent. |
| resizeLast | If the last element should be resized to fill out the parent. |
| wrap | Value at which a new column or row should be created. |
| borderCollapse | If the strokeWidth should be ignored. |
| allowGaps | If gaps should be allowed in the stack. |
| gridSize | Grid size for alignment of position and size. |
| Functions | |
| isHorizontal | Returns horizontal. |
| moveCell | Implements mxGraphLayout.moveCell. |
| getParentSize | Returns the size for the parent container or the size of the graph container if the parent is a layer or the root of the model. |
| getLayoutCells | Returns the cells to be layouted. |
| snap | Snaps the given value to the grid size. |
| execute | Implements mxGraphLayout.execute. |
| execute | Implements mxGraphLayout.execute. |
| execute | Implements mxGraphLayout.execute. |
| mxPartitionLayout | Extends mxGraphLayout for partitioning the parent cell vertically or horizontally by filling the complete area with the child cells. |
| Functions | |
| mxPartitionLayout | Constructs a new stack layout layout for the specified graph, spacing, orientation and offset. |
| Variables | |
| horizontal | Boolean indicating the direction in which the space is partitioned. |
| spacing | Integer that specifies the absolute spacing in pixels between the children. |
| border | Integer that specifies the absolute inset in pixels for the parent that contains the children. |
| resizeVertices | Boolean that specifies if vertices should be resized. |
| Functions | |
| isHorizontal | Returns horizontal. |
| moveCell | Implements mxGraphLayout.moveCell. |
| execute | Implements mxGraphLayout.execute. |
| mxCompactTreeLayout | Extends mxGraphLayout to implement a compact tree (Moen) algorithm. |
| Functions | |
| mxCompactTreeLayout | Constructs a new compact tree layout for the specified graph and orientation. |
| Variables | |
| horizontal | Specifies the orientation of the layout. |
| invert | Specifies if edge directions should be inverted. |
| resizeParent | If the parents should be resized to match the width/height of the children. |
| maintainParentLocation | Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout. |
| groupPadding | Padding added to resized parents. |
| groupPaddingTop | Top padding added to resized parents. |
| groupPaddingRight | Right padding added to resized parents. |
| groupPaddingBottom | Bottom padding added to resized parents. |
| groupPaddingLeft | Left padding added to resized parents. |
| parentsChanged | A set of the parents that need updating based on children process as part of the layout. |
| moveTree | Specifies if the tree should be moved to the top, left corner if it is inside a top-level layer. |
| visited | Specifies if the tree should be moved to the top, left corner if it is inside a top-level layer. |
| levelDistance | Holds the levelDistance. |
| nodeDistance | Holds the nodeDistance. |
| resetEdges | Specifies if all edge points of traversed edges should be removed. |
| prefHozEdgeSep | The preferred horizontal distance between edges exiting a vertex. |
| prefVertEdgeOff | The preferred vertical offset between edges exiting a vertex. |
| minEdgeJetty | The minimum distance for an edge jetty from a vertex. |
| channelBuffer | The size of the vertical buffer in the center of inter-rank channels where edge control points should not be placed. |
| edgeRouting | Whether or not to apply the internal tree edge routing. |
| sortEdges | Specifies if edges should be sorted according to the order of their opposite terminal cell in the model. |
| alignRanks | Whether or not the tops of cells in each rank should be aligned across the rank |
| maxRankHeight | An array of the maximum height of cells (relative to the layout direction) per rank |
| root | The cell to use as the root of the tree |
| node | The internal node representation of the root cell. |
| Functions | |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored as a vertex. |
| isHorizontal | Returns horizontal. |
| execute | Implements mxGraphLayout.execute. |
| moveNode | Moves the specified node and all of its children by the given amount. |
| sortOutgoingEdges | Called if sortEdges is true to sort the array of outgoing edges in place. |
| findRankHeights | Stores the maximum height (relative to the layout direction) of cells in each rank |
| setCellHeights | Set the cells heights (relative to the layout direction) when the tops of each rank are to be aligned |
| dfs | Does a depth first search starting at the specified cell. |
| layout | Starts the actual compact tree layout algorithm at the given node. |
| horizontalLayout | |
| verticalLayout | |
| attachParent | |
| layoutLeaf | |
| join | |
| merge | |
| offset | |
| bridge | |
| createNode | |
| apply | |
| createLine | |
| adjustParents | Adjust parent cells whose child geometries have changed. |
| localEdgeProcessing | Moves the specified node and all of its children by the given amount. |
| localEdgeProcessing | Separates the x position of edges as they connect to vertices |
| mxRadialTreeLayout | Extends mxGraphLayout to implement a radial tree algorithm. |
| Functions | |
| mxRadialTreeLayout | Constructs a new radial tree layout for the specified graph |
| Variables | |
| angleOffset | The initial offset to compute the angle position. |
| rootx | The X co-ordinate of the root cell |
| rooty | The Y co-ordinate of the root cell |
| levelDistance | Holds the levelDistance. |
| nodeDistance | Holds the nodeDistance. |
| autoRadius | Specifies if the radios should be computed automatically |
| sortEdges | Specifies if edges should be sorted according to the order of their opposite terminal cell in the model. |
| rowMinX | Array of leftmost x coordinate of each row |
| rowMaxX | Array of rightmost x coordinate of each row |
| rowMinCenX | Array of x coordinate of leftmost vertex of each row |
| rowMaxCenX | Array of x coordinate of rightmost vertex of each row |
| rowRadi | Array of y deltas of each row behind root vertex, also the radius in the tree |
| row | Array of vertices on each row |
| Functions | |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored as a vertex. |
| execute | Implements mxGraphLayout.execute. |
| calcRowDims | Recursive function to calculate the dimensions of each row |
| mxFastOrganicLayout | Extends mxGraphLayout to implement a fast organic layout algorithm. |
| Functions | |
| mxCompactTreeLayout | Constructs a new fast organic layout for the specified graph. |
| Variables | |
| useInputOrigin | Specifies if the top left corner of the input cells should be the origin of the layout result. |
| resetEdges | Specifies if all edge points of traversed edges should be removed. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| forceConstant | The force constant by which the attractive forces are divided and the replusive forces are multiple by the square of. |
| forceConstantSquared | Cache of <forceConstant>^2 for performance. |
| minDistanceLimit | Minimal distance limit. |
| minDistanceLimit | Minimal distance limit. |
| minDistanceLimitSquared | Cached version of minDistanceLimit squared. |
| initialTemp | Start value of temperature. |
| temperature | Temperature to limit displacement at later stages of layout. |
| maxIterations | Total number of iterations to run the layout though. |
| iteration | Current iteration count. |
| vertexArray | An array of all vertices to be laid out. |
| dispX | An array of locally stored X co-ordinate displacements for the vertices. |
| dispY | An array of locally stored Y co-ordinate displacements for the vertices. |
| cellLocation | An array of locally stored co-ordinate positions for the vertices. |
| radius | The approximate radius of each cell, nodes only. |
| radiusSquared | The approximate radius squared of each cell, nodes only. |
| isMoveable | Array of booleans representing the movable states of the vertices. |
| neighbours | Local copy of cell neighbours. |
| indices | Hashtable from cells to local indices. |
| allowedToRun | Boolean flag that specifies if the layout is allowed to run. |
| Functions | |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored as a vertex. |
| execute | Implements mxGraphLayout.execute. |
| calcPositions | Takes the displacements calculated for each cell and applies them to the local cache of cell positions. |
| calcAttraction | Calculates the attractive forces between all laid out nodes linked by edges |
| calcRepulsion | Calculates the repulsive forces between all laid out nodes |
| reduceTemperature | Reduces the temperature of the layout from an initial setting in a linear fashion to zero. |
| mxCircleLayout | Extends mxGraphLayout to implement a circluar layout for a given radius. |
| Functions | |
| mxCircleLayout | Constructs a new circular layout for the specified radius. |
| Variables | |
| radius | Integer specifying the size of the radius. |
| moveCircle | Boolean specifying if the circle should be moved to the top, left corner specified by x0 and y0. |
| x0 | Integer specifying the left coordinate of the circle. |
| y0 | Integer specifying the top coordinate of the circle. |
| resetEdges | Specifies if all edge points of traversed edges should be removed. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| Functions | |
| execute | Implements mxGraphLayout.execute. |
| getRadius | Returns the radius to be used for the given vertex count. |
| circle | Executes the circular layout for the specified array of vertices and the given radius. |
| mxParallelEdgeLayout | Extends mxGraphLayout for arranging parallel edges. |
| Functions | |
| mxCompactTreeLayout | Constructs a new fast organic layout for the specified graph. |
| Variables | |
| spacing | Defines the spacing between the parallels. |
| Functions | |
| execute | Implements mxGraphLayout.execute. |
| findParallels | Finds the parallel edges in the given parent. |
| getEdgeId | Returns a unique ID for the given edge. |
| layout | Lays out the parallel edges in the given array. |
| route | Routes the given edge via the given point. |
| mxCompositeLayout | Allows to compose multiple layouts into a single layout. |
| Functions | |
| mxCompositeLayout | Constructs a new layout using the given layouts. |
| Variables | |
| layouts | Holds the array of mxGraphLayouts that this layout contains. |
| layouts | Reference to the mxGraphLayouts that handles moves. |
| Functions | |
| moveCell | Implements mxGraphLayout.moveCell by calling move on <master> or the first layout in layouts. |
| execute | Implements mxGraphLayout.execute by executing all layouts in a single transaction. |
| mxEdgeLabelLayout | Extends mxGraphLayout to implement an edge label layout. |
| Functions | |
| mxEdgeLabelLayout | Constructs a new edge label layout. |
| execute | Implements mxGraphLayout.execute. |
| placeLabels | Places the labels of the given edges. |
| avoid | Places the labels of the given edges. |
| mxGraphAbstractHierarchyCell | An abstraction of an internal hierarchy node or edge |
| Functions | |
| mxGraphAbstractHierarchyCell | Constructs a new hierarchical layout algorithm. |
| Variables | |
| maxRank | The maximum rank this cell occupies. |
| minRank | The minimum rank this cell occupies. |
| x | The x position of this cell for each layer it occupies |
| y | The y position of this cell for each layer it occupies |
| width | The width of this cell |
| height | The height of this cell |
| nextLayerConnectedCells | A cached version of the cells this cell connects to on the next layer up |
| previousLayerConnectedCells | A cached version of the cells this cell connects to on the next layer down |
| temp | Temporary variable for general use. |
| Functions | |
| getNextLayerConnectedCells | Returns the cells this cell connects to on the next layer up |
| getPreviousLayerConnectedCells | Returns the cells this cell connects to on the next layer down |
| isEdge | Returns whether or not this cell is an edge |
| isVertex | Returns whether or not this cell is a node |
| getGeneralPurposeVariable | Gets the value of temp for the specified layer |
| setGeneralPurposeVariable | Set the value of temp for the specified layer |
| setX | Set the value of x for the specified layer |
| getX | Gets the value of x on the specified layer |
| setY | Set the value of y for the specified layer |
| mxGraphHierarchyNode | An abstraction of a hierarchical edge for the hierarchy layout |
| Functions | |
| mxGraphHierarchyNode | Constructs an internal node to represent the specified real graph cell |
| Variables | |
| cell | The graph cell this object represents. |
| id | The object identity of the wrapped cell |
| connectsAsTarget | Collection of hierarchy edges that have this node as a target |
| connectsAsSource | Collection of hierarchy edges that have this node as a source |
| hashCode | Assigns a unique hashcode for each node. |
| Functions | |
| getRankValue | Returns the integer value of the layer that this node resides in |
| getNextLayerConnectedCells | Returns the cells this cell connects to on the next layer up |
| getPreviousLayerConnectedCells | Returns the cells this cell connects to on the next layer down |
| isVertex | Returns true. |
| getGeneralPurposeVariable | Gets the value of temp for the specified layer |
| setGeneralPurposeVariable | Set the value of temp for the specified layer |
| isAncestor | |
| getCoreCell | Gets the core vertex associated with this wrapper |
| mxGraphHierarchyEdge | An abstraction of a hierarchical edge for the hierarchy layout |
| Functions | |
| mxGraphHierarchyEdge | Constructs a hierarchy edge |
| Variables | |
| edges | The graph edge(s) this object represents. |
| ids | The object identities of the wrapped cells |
| source | The node this edge is sourced at |
| target | The node this edge targets |
| isReversed | Whether or not the direction of this edge has been reversed internally to create a DAG for the hierarchical layout |
| Functions | |
| invert | Inverts the direction of this internal edge(s) |
| getNextLayerConnectedCells | Returns the cells this cell connects to on the next layer up |
| getPreviousLayerConnectedCells | Returns the cells this cell connects to on the next layer down |
| isEdge | Returns true. |
| getGeneralPurposeVariable | Gets the value of temp for the specified layer |
| setGeneralPurposeVariable | Set the value of temp for the specified layer |
| getCoreCell | Gets the first core edge associated with this wrapper |
| mxGraphHierarchyModel | Internal model of a hierarchical graph. |
| Functions | |
| mxGraphHierarchyModel | Creates an internal ordered graph model using the vertices passed in. |
| Variables | |
| maxRank | Stores the largest rank number allocated |
| vertexMapper | Map from graph vertices to internal model nodes. |
| edgeMapper | Map from graph edges to internal model edges |
| ranks | Mapping from rank number to actual rank |
| roots | Store of roots of this hierarchy model, these are real graph cells, not internal cells |
| parent | The parent cell whose children are being laid out |
| dfsCount | Count of the number of times the ancestor dfs has been used. |
| SOURCESCANSTARTRANK | High value to start source layering scan rank value from. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| Functions | |
| createInternalCells | Creates all edges in the internal model |
| initialRank | Basic determination of minimum layer ranking by working from from sources or sinks and working through each node in the relevant edge direction. |
| fixRanks | Fixes the layer assignments to the values stored in the nodes. |
| visit | A depth first search through the internal heirarchy model. |
| dfs | Performs a depth first search on the internal hierarchy model |
| extendedDfs | Performs a depth first search on the internal hierarchy model. |
| mxSwimlaneModel | Internal model of a hierarchical graph. |
| Functions | |
| mxSwimlaneModel | Creates an internal ordered graph model using the vertices passed in. |
| Variables | |
| maxRank | Stores the largest rank number allocated |
| vertexMapper | Map from graph vertices to internal model nodes. |
| edgeMapper | Map from graph edges to internal model edges |
| ranks | Mapping from rank number to actual rank |
| roots | Store of roots of this hierarchy model, these are real graph cells, not internal cells |
| parent | The parent cell whose children are being laid out |
| dfsCount | Count of the number of times the ancestor dfs has been used. |
| SOURCESCANSTARTRANK | High value to start source layering scan rank value from. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| ranksPerGroup | An array of the number of ranks within each swimlane |
| Functions | |
| createInternalCells | Creates all edges in the internal model |
| initialRank | Basic determination of minimum layer ranking by working from from sources or sinks and working through each node in the relevant edge direction. |
| maxChainDfs | Performs a depth first search on the internal hierarchy model. |
| fixRanks | Fixes the layer assignments to the values stored in the nodes. |
| visit | A depth first search through the internal heirarchy model. |
| dfs | Performs a depth first search on the internal hierarchy model |
| extendedDfs | Performs a depth first search on the internal hierarchy model. |
| mxHierarchicalLayoutStage | The specific layout interface for hierarchical layouts. |
| Functions | |
| mxHierarchicalLayoutStage | Constructs a new hierarchical layout stage. |
| execute | Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use. |
| mxMedianHybridCrossingReduction | Sets the horizontal locations of node and edge dummy nodes on each layer. |
| Functions | |
| mxMedianHybridCrossingReduction | Creates a coordinate assignment. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| maxIterations | The maximum number of iterations to perform whilst reducing edge crossings. |
| nestedBestRanks | Stores each rank as a collection of cells in the best order found for each layer so far |
| currentBestCrossings | The total number of crossings found in the best configuration so far |
| iterationsWithoutImprovement | The total number of crossings found in the best configuration so far |
| maxNoImprovementIterations | The total number of crossings found in the best configuration so far |
| Functions | |
| execute | Performs a vertex ordering within ranks as described by Gansner et al 1993 |
| calculateCrossings | Calculates the total number of edge crossing in the current graph. |
| calculateRankCrossing | Calculates the number of edges crossings between the specified rank and the rank below it. |
| transpose | Takes each possible adjacent cell pair on each rank and checks if swapping them around reduces the number of crossing |
| weightedMedian | Sweeps up or down the layout attempting to minimise the median placement of connected cells on adjacent ranks |
| medianRank | Attempts to minimise the median placement of connected cells on this rank and one of the adjacent ranks |
| medianValue | Calculates the median rank order positioning for the specified cell using the connected cells on the specified rank. |
| MedianCellSorter | A utility class used to track cells whilst sorting occurs on the median values. |
| Functions | |
| MedianCellSorter | Constructs a new median cell sorter. |
| Variables | |
| medianValue | The weighted value of the cell stored. |
| cell | The cell whose median value is being calculated |
| Functions | |
| compare | Compares two MedianCellSorters. |
| mxMinimumCycleRemover | An implementation of the first stage of the Sugiyama layout. |
| Functions | |
| mxMinimumCycleRemover | Creates a cycle remover for the given internal model. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| Functions | |
| execute | Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use. |
| mxCoordinateAssignment | Sets the horizontal locations of node and edge dummy nodes on each layer. |
| Functions | |
| mxCoordinateAssignment | Creates a coordinate assignment. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| intraCellSpacing | The minimum buffer between cells on the same rank. |
| interRankCellSpacing | The minimum distance between cells on adjacent ranks. |
| parallelEdgeSpacing | The distance between each parallel edge on each ranks for long edges. |
| maxIterations | The number of heuristic iterations to run. |
| prefHozEdgeSep | The preferred horizontal distance between edges exiting a vertex |
| prefVertEdgeOff | The preferred vertical offset between edges exiting a vertex |
| minEdgeJetty | The minimum distance for an edge jetty from a vertex |
| channelBuffer | The size of the vertical buffer in the center of inter-rank channels where edge control points should not be placed |
| jettyPositions | Map of internal edges and (x,y) pair of positions of the start and end jetty for that edge where it connects to the source and target vertices. |
| orientation | The position of the root ( start ) node(s) relative to the rest of the laid out graph. |
| initialX | The minimum x position node placement starts at |
| limitX | The maximum x value this positioning lays up to |
| currentXDelta | The sum of x-displacements for the current iteration |
| widestRank | The rank that has the widest x position |
| rankTopY | Internal cache of top-most values of Y for each rank |
| rankBottomY | Internal cache of bottom-most value of Y for each rank |
| widestRankValue | The X-coordinate of the edge of the widest rank |
| rankWidths | The width of all the ranks |
| rankY | The Y-coordinate of all the ranks |
| fineTuning | Whether or not to perform local optimisations and iterate multiple times through the algorithm. |
| nextLayerConnectedCache | A store of connections to the layer above for speed |
| previousLayerConnectedCache | A store of connections to the layer below for speed |
| groupPadding | Padding added to resized parents |
| Functions | |
| execute | A basic horizontal coordinate assignment algorithm |
| minNode | Performs one median positioning sweep in both directions |
| medianPos | Performs one median positioning sweep in one direction |
| rankMedianPosition | Performs median minimisation over one rank. |
| calculatedWeightedValue | Calculates the priority the specified cell has based on the type of its cell and the cells it is connected to on the next layer |
| medianXValue | Calculates the median position of the connected cell on the specified rank |
| initialCoords | Sets up the layout in an initial positioning. |
| rankCoordinates | Sets up the layout in an initial positioning. |
| calculateWidestRank | Calculates the width rank in the hierarchy. |
| minPath | Straightens out chains of virtual nodes where possibleacade to those stored after this layout processing step has completed. |
| repositionValid | Determines whether or not a node may be moved to the specified x position on the specified rank |
| setCellLocations | Sets the cell locations in the facade to those stored after this layout processing step has completed. |
| localEdgeProcessing | Separates the x position of edges as they connect to vertices |
| setEdgePosition | Fixes the control points |
| setVertexLocation | Fixes the position of the specified vertex. |
| processReversedEdge | Hook to add additional processing |
| mxSwimlaneOrdering | An implementation of the first stage of the Sugiyama layout. |
| Functions | |
| mxSwimlaneOrdering | Creates a cycle remover for the given internal model. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| Functions | |
| execute | Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use. |
| mxHierarchicalLayout | A hierarchical layout algorithm. |
| Functions | |
| mxHierarchicalLayout | Constructs a new hierarchical layout algorithm. |
| Variables | |
| roots | Holds the array of mxCell that this layout contains. |
| resizeParent | Specifies if the parent should be resized after the layout so that it contains all the child cells. |
| maintainParentLocation | Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout. |
| moveParent | Specifies if the parent should be moved if resizeParent is enabled. |
| parentBorder | The border to be added around the children if the parent is to be resized using resizeParent. |
| intraCellSpacing | The spacing buffer added between cells on the same layer. |
| interRankCellSpacing | The spacing buffer added between cell on adjacent layers. |
| interHierarchySpacing | The spacing buffer between unconnected hierarchies. |
| parallelEdgeSpacing | The distance between each parallel edge on each ranks for long edges |
| orientation | The position of the root node(s) relative to the laid out graph in. |
| fineTuning | Whether or not to perform local optimisations and iterate multiple times through the algorithm. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| traverseAncestors | Whether or not to drill into child cells and layout in reverse group order. |
| model | The internal mxGraphHierarchyModel formed of the layout. |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgeStyle | The style to apply between cell layers to edge segments |
| Functions | |
| getModel | Returns the internal mxGraphHierarchyModel for this layout algorithm. |
| execute | Executes the layout for the children of the specified parent. |
| findRoots | Returns all visible children in the given parent which do not have incoming edges. |
| getEdges | Returns the connected edges for the given cell. |
| getVisibleTerminal | Helper function to return visible terminal for edge allowing for ports |
| run | The API method used to exercise the layout upon the graph description and produce a separate description of the vertex position and edge routing changes made. |
| filterDescendants | Creates an array of descendant cells |
| isPort | Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal |
| getEdgesBetween | Returns the edges between the given source and target. |
| cycleStage | Executes the cycle stage using mxMinimumCycleRemover. |
| layeringStage | Implements first stage of a Sugiyama layout. |
| crossingStage | Executes the crossing stage using mxMedianHybridCrossingReduction. |
| placementStage | Executes the placement stage using mxCoordinateAssignment. |
| mxSwimlaneLayout | A hierarchical layout algorithm. |
| Functions | |
| mxSwimlaneLayout | Constructs a new hierarchical layout algorithm. |
| Variables | |
| roots | Holds the array of mxCell that this layout contains. |
| swimlanes | Holds the array of mxCell of the ordered swimlanes to lay out |
| dummyVertices | Holds an array of mxCell of dummy vertices inserted during the layout to pad out empty swimlanes |
| dummyVertexWidth | The cell width of any dummy vertices inserted |
| resizeParent | Specifies if the parent should be resized after the layout so that it contains all the child cells. |
| maintainParentLocation | Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout. |
| moveParent | Specifies if the parent should be moved if resizeParent is enabled. |
| parentBorder | The border to be added around the children if the parent is to be resized using resizeParent. |
| intraCellSpacing | The spacing buffer added between cells on the same layer. |
| interRankCellSpacing | The spacing buffer added between cell on adjacent layers. |
| interHierarchySpacing | The spacing buffer between unconnected hierarchies. |
| parallelEdgeSpacing | The distance between each parallel edge on each ranks for long edges |
| orientation | The position of the root node(s) relative to the laid out graph in. |
| fineTuning | Whether or not to perform local optimisations and iterate multiple times through the algorithm. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| traverseAncestors | Whether or not to drill into child cells and layout in reverse group order. |
| model | The internal mxSwimlaneModel formed of the layout. |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgeStyle | The style to apply between cell layers to edge segments |
| Functions | |
| getModel | Returns the internal mxSwimlaneModel for this layout algorithm. |
| execute | Executes the layout for the children of the specified parent. |
| updateGroupBounds | Updates the bounds of the given array of groups so that it includes all child vertices. |
| findRoots | Returns all visible children in the given parent which do not have incoming edges. |
| getEdges | Returns the connected edges for the given cell. |
| getVisibleTerminal | Helper function to return visible terminal for edge allowing for ports |
| run | The API method used to exercise the layout upon the graph description and produce a separate description of the vertex position and edge routing changes made. |
| filterDescendants | Creates an array of descendant cells |
| isPort | Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal |
| getEdgesBetween | Returns the edges between the given source and target. |
| cycleStage | Executes the cycle stage using mxMinimumCycleRemover. |
| layeringStage | Implements first stage of a Sugiyama layout. |
| crossingStage | Executes the crossing stage using mxMedianHybridCrossingReduction. |
| placementStage | Executes the placement stage using mxCoordinateAssignment. |
| mxGraphModel | Extends mxEventSource to implement a graph model. |
| Events | |
| mxEvent. | Fires when an undoable edit is dispatched. |
| mxEvent. | Same as mxEvent.CHANGE, this event can be used for classes that need to implement a sync mechanism between this model and, say, a remote model. |
| mxEvent. | Fires between begin- and endUpdate and after an atomic change was executed in the model. |
| mxEvent. | Fires between START_EDIT and END_EDIT after an atomic change was executed. |
| mxEvent. | Fires after the updateLevel was incremented in beginUpdate. |
| mxEvent. | Fires after the updateLevel was changed from 0 to 1. |
| mxEvent. | Fires after the updateLevel was decreased in endUpdate but before any notification or change dispatching. |
| mxEvent. | Fires after the updateLevel was changed from 1 to 0. |
| mxEvent. | Fires before the change is dispatched after the update level has reached 0 in endUpdate. |
| mxEvent.UNDO | Fires after the change was dispatched in endUpdate. |
| Functions | |
| mxGraphModel | Constructs a new graph model. |
| Variables | |
| root | Holds the root cell, which in turn contains the cells that represent the layers of the diagram as child cells. |
| cells | Maps from Ids to cells. |
| maintainEdgeParent | Specifies if edges should automatically be moved into the nearest common ancestor of their terminals. |
| ignoreRelativeEdgeParent | Specifies if relative edge parents should be ignored for finding the nearest common ancestors of an edge’s terminals. |
| createIds | Specifies if the model should automatically create Ids for new cells. |
| prefix | Defines the prefix of new Ids. |
| postfix | Defines the postfix of new Ids. |
| nextId | Specifies the next Id to be created. |
| currentEdit | Holds the changes for the current transaction. |
| updateLevel | Counter for the depth of nested transactions. |
| endingUpdate | True if the program flow is currently inside endUpdate. |
| Functions | |
| clear | Sets a new root using createRoot. |
| isCreateIds | Returns createIds. |
| setCreateIds | Sets createIds. |
| createRoot | Creates a new root cell with a default layer (child 0). |
| getCell | Returns the mxCell for the specified Id or null if no cell can be found for the given Id. |
| filterCells | Returns the cells from the given array where the given filter function returns true. |
| getDescendants | Returns all descendants of the given cell and the cell itself in an array. |
| filterDescendants | Visits all cells recursively and applies the specified filter function to each cell. |
| getRoot | Returns the root of the model or the topmost parent of the given cell. |
| setRoot | Sets the root of the model using mxRootChange and adds the change to the current transaction. |
| rootChanged | Inner callback to change the root of the model and update the internal datastructures, such as cells and nextId. |
| isRoot | Returns true if the given cell is the root of the model and a non-null value. |
| isLayer | Returns true if isRoot returns true for the parent of the given cell. |
| isAncestor | Returns true if the given parent is an ancestor of the given child. |
| contains | Returns true if the model contains the given mxCell. |
| getParent | Returns the parent of the given cell. |
| add | Adds the specified child to the parent at the given index using mxChildChange and adds the change to the current transaction. |
| cellAdded | Inner callback to update cells when a cell has been added. |
| createId | Hook method to create an Id for the specified cell. |
| updateEdgeParents | Updates the parent for all edges that are connected to cell or one of its descendants using updateEdgeParent. |
| updateEdgeParent | Inner callback to update the parent of the specified mxCell to the nearest-common-ancestor of its two terminals. |
| getOrigin | Returns the absolute, accumulated origin for the children inside the given parent as an mxPoint. |
| getNearestCommonAncestor | Returns the nearest common ancestor for the specified cells. |
| remove | Removes the specified cell from the model using mxChildChange and adds the change to the current transaction. |
| cellRemoved | Inner callback to update cells when a cell has been removed. |
| parentForCellChanged | Inner callback to update the parent of a cell using mxCell.insert on the parent and return the previous parent. |
| getChildCount | Returns the number of children in the given cell. |
| getChildAt | Returns the child of the given mxCell at the given index. |
| getChildren | Returns all children of the given mxCell as an array of mxCells. |
| getChildVertices | Returns the child vertices of the given parent. |
| getChildEdges | Returns the child edges of the given parent. |
| getChildCells | Returns the children of the given cell that are vertices and/or edges depending on the arguments. |
| getTerminal | Returns the source or target mxCell of the given edge depending on the value of the boolean parameter. |
| setTerminal | Sets the source or target terminal of the given mxCell using mxTerminalChange and adds the change to the current transaction. |
| setTerminals | Sets the source and target mxCell of the given mxCell in a single transaction using setTerminal for each end of the edge. |
| terminalForCellChanged | Inner helper function to update the terminal of the edge using mxCell.insertEdge and return the previous terminal. |
| getEdgeCount | Returns the number of distinct edges connected to the given cell. |
| getEdgeAt | Returns the edge of cell at the given index. |
| getDirectedEdgeCount | Returns the number of incoming or outgoing edges, ignoring the given edge. |
| getConnections | Returns all edges of the given cell without loops. |
| getIncomingEdges | Returns the incoming edges of the given cell without loops. |
| getOutgoingEdges | Returns the outgoing edges of the given cell without loops. |
| getEdges | Returns all distinct edges connected to this cell as a new array of mxCells. |
| getEdgesBetween | Returns all edges between the given source and target pair. |
| getOpposites | Returns all opposite vertices wrt terminal for the given edges, only returning sources and/or targets as specified. |
| getTopmostCells | Returns the topmost cells of the hierarchy in an array that contains no descendants for each mxCell that it contains. |
| isVertex | Returns true if the given cell is a vertex. |
| isEdge | Returns true if the given cell is an edge. |
| isConnectable | Returns true if the given mxCell is connectable. |
| getValue | Returns the user object of the given mxCell using mxCell.getValue. |
| setValue | Sets the user object of then given mxCell using mxValueChange and adds the change to the current transaction. |
| valueForCellChanged | Inner callback to update the user object of the given mxCell using mxCell.valueChanged and return the previous value, that is, the return value of mxCell.valueChanged. |
| getGeometry | Returns the mxGeometry of the given mxCell. |
| setGeometry | Sets the mxGeometry of the given mxCell. |
| geometryForCellChanged | Inner callback to update the mxGeometry of the given mxCell using mxCell.setGeometry and return the previous mxGeometry. |
| getStyle | Returns the style of the given mxCell. |
| setStyle | Sets the style of the given mxCell using mxStyleChange and adds the change to the current transaction. |
| styleForCellChanged | Inner callback to update the style of the given mxCell using mxCell.setStyle and return the previous style. |
| isCollapsed | Returns true if the given mxCell is collapsed. |
| setCollapsed | Sets the collapsed state of the given mxCell using mxCollapseChange and adds the change to the current transaction. |
| collapsedStateForCellChanged | Inner callback to update the collapsed state of the given mxCell using mxCell.setCollapsed and return the previous collapsed state. |
| isVisible | Returns true if the given mxCell is visible. |
| setVisible | Sets the visible state of the given mxCell using mxVisibleChange and adds the change to the current transaction. |
| visibleStateForCellChanged | Inner callback to update the visible state of the given mxCell using mxCell.setCollapsed and return the previous visible state. |
| execute | Executes the given edit and fires events if required. |
| beginUpdate | Increments the updateLevel by one. |
| endUpdate | Decrements the updateLevel by one and fires an <undo> event if the updateLevel reaches 0. |
| createUndoableEdit | Creates a new mxUndoableEdit that implements the notify function to fire a <change> and <notify> event through the mxUndoableEdit’s source. |
| mergeChildren | Merges the children of the given cell into the given target cell inside this model. |
| mergeChildren | Clones the children of the source cell into the given target cell in this model and adds an entry to the mapping that maps from the source cell to the target cell with the same id or the clone of the source cell that was inserted into this model. |
| getParents | Returns an array that represents the set (no duplicates) of all parents for the given array of cells. |
| cloneCell | Returns a deep clone of the given mxCell (including the children) which is created using cloneCells. |
| cloneCells | Returns an array of clones for the given array of mxCells. |
| cloneCellImpl | Inner helper method for cloning cells recursively. |
| cellCloned | Hook for cloning the cell. |
| restoreClone | Inner helper method for restoring the connections in a network of cloned cells. |
| mxRootChange | Action to change the root in a model. |
| Functions | |
| mxRootChange | Constructs a change of the root in the specified model. |
| execute | Carries out a change of the root using mxGraphModel.rootChanged. |
| mxChildChange | Action to add or remove a child in a model. |
| Functions | |
| mxChildChange | Constructs a change of a child in the specified model. |
| execute | Changes the parent of <child> using mxGraphModel.parentForCellChanged and removes or restores the cell’s connections. |
| disconnect | Disconnects the given cell recursively from its terminals and stores the previous terminal in the cell’s terminals. |
| mxTerminalChange | Action to change a terminal in a model. |
| Functions | |
| mxTerminalChange | Constructs a change of a terminal in the specified model. |
| execute | Changes the terminal of <cell> to <previous> using mxGraphModel.terminalForCellChanged. |
| mxValueChange | Action to change a user object in a model. |
| Functions | |
| mxValueChange | Constructs a change of a user object in the specified model. |
| execute | Changes the value of <cell> to <previous> using mxGraphModel.valueForCellChanged. |
| mxStyleChange | Action to change a cell’s style in a model. |
| Functions | |
| mxStyleChange | Constructs a change of a style in the specified model. |
| execute | Changes the style of <cell> to <previous> using mxGraphModel.styleForCellChanged. |
| mxGeometryChange | Action to change a cell’s geometry in a model. |
| Functions | |
| mxGeometryChange | Constructs a change of a geometry in the specified model. |
| execute | Changes the geometry of <cell> ro <previous> using mxGraphModel.geometryForCellChanged. |
| mxCollapseChange | Action to change a cell’s collapsed state in a model. |
| Functions | |
| mxCollapseChange | Constructs a change of a collapsed state in the specified model. |
| execute | Changes the collapsed state of <cell> to <previous> using mxGraphModel.collapsedStateForCellChanged. |
| mxVisibleChange | Action to change a cell’s visible state in a model. |
| Functions | |
| mxVisibleChange | Constructs a change of a visible state in the specified model. |
| execute | Changes the visible state of <cell> to <previous> using mxGraphModel.visibleStateForCellChanged. |
| mxCellAttributeChange | Action to change the attribute of a cell’s user object. |
| Functions | |
| mxCellAttributeChange | Constructs a change of a attribute of the DOM node stored as the value of the given mxCell. |
| execute | Changes the attribute of the cell’s user object by using mxCell.setAttribute. |
| mxCell | Cells are the elements of the graph model. |
| Functions | |
| onInit | Called from within the constructor. |
| mxCell | Constructs a new cell to be used in a graph model. |
| Variables | |
| id | Holds the Id. |
| value | Holds the user object. |
| geometry | Holds the mxGeometry. |
| style | Holds the style as a string of the form [(stylename|key=value);]. |
| vertex | Specifies whether the cell is a vertex. |
| edge | Specifies whether the cell is an edge. |
| connectable | Specifies whether the cell is connectable. |
| visible | Specifies whether the cell is visible. |
| collapsed | Specifies whether the cell is collapsed. |
| parent | Reference to the parent cell. |
| source | Reference to the source terminal. |
| target | Reference to the target terminal. |
| children | Holds the child cells. |
| edges | Holds the edges. |
| mxTransient | List of members that should not be cloned inside clone. |
| Functions | |
| getId | Returns the Id of the cell as a string. |
| setId | Sets the Id of the cell to the given string. |
| getValue | Returns the user object of the cell. |
| setValue | Sets the user object of the cell. |
| valueChanged | Changes the user object after an in-place edit and returns the previous value. |
| getGeometry | Returns the mxGeometry that describes the geometry. |
| setGeometry | Sets the mxGeometry to be used as the geometry. |
| getStyle | Returns a string that describes the style. |
| setStyle | Sets the string to be used as the style. |
| isVertex | Returns true if the cell is a vertex. |
| setVertex | Specifies if the cell is a vertex. |
| isEdge | Returns true if the cell is an edge. |
| setEdge | Specifies if the cell is an edge. |
| isConnectable | Returns true if the cell is connectable. |
| setConnectable | Sets the connectable state. |
| isVisible | Returns true if the cell is visibile. |
| setVisible | Specifies if the cell is visible. |
| isCollapsed | Returns true if the cell is collapsed. |
| setCollapsed | Sets the collapsed state. |
| getParent | Returns the cell’s parent. |
| setParent | Sets the parent cell. |
| getTerminal | Returns the source or target terminal. |
| setTerminal | Sets the source or target terminal and returns the new terminal. |
| getChildCount | Returns the number of child cells. |
| getIndex | Returns the index of the specified child in the child array. |
| getChildAt | Returns the child at the specified index. |
| insert | Inserts the specified child into the child array at the specified index and updates the parent reference of the child. |
| remove | Removes the child at the specified index from the child array and returns the child that was removed. |
| removeFromParent | Removes the cell from its parent. |
| getEdgeCount | Returns the number of edges in the edge array. |
| getEdgeIndex | Returns the index of the specified edge in edges. |
| getEdgeAt | Returns the edge at the specified index in edges. |
| insertEdge | Inserts the specified edge into the edge array and returns the edge. |
| removeEdge | Removes the specified edge from the edge array and returns the edge. |
| removeFromTerminal | Removes the edge from its source or target terminal. |
| hasAttribute | Returns true if the user object is an XML node that contains the given attribute. |
| getAttribute | Returns the specified attribute from the user object if it is an XML node. |
| setAttribute | Sets the specified attribute on the user object if it is an XML node. |
| clone | Returns a clone of the cell. |
| cloneValue | Returns a clone of the cell’s user object. |
| mxGeometry | Extends mxRectangle to represent the geometry of a cell. |
| Functions | |
| mxGeometry | Constructs a new object to describe the size and location of a vertex or the control points of an edge. |
| Variables | |
| TRANSLATE_CONTROL_POINTS | Global switch to translate the points in translate. |
| alternateBounds | Stores alternate values for x, y, width and height in a rectangle. |
| sourcePoint | Defines the source mxPoint of the edge. |
| targetPoint | Defines the target mxPoint of the edge. |
| points | Array of mxPoints which specifies the control points along the edge. |
| offset | For edges, this holds the offset (in pixels) from the position defined by <x> and <y> on the edge. |
| relative | Specifies if the coordinates in the geometry are to be interpreted as relative coordinates. |
| Functions | |
| swap | Swaps the x, y, width and height with the values stored in alternateBounds and puts the previous values into alternateBounds as a rectangle. |
| getTerminalPoint | Returns the mxPoint representing the source or target point of this edge. |
| setTerminalPoint | Sets the sourcePoint or targetPoint to the given mxPoint and returns the new point. |
| rotate | Rotates the geometry by the given angle around the given center. |
| translate | Translates the geometry by the specified amount. |
| scale | Scales the geometry by the given amount. |
| equals | Returns true if the given object equals this geometry. |
| mxCellPath | Implements a mechanism for temporary cell Ids. |
| Variables | |
| PATH_SEPARATOR | Defines the separator between the path components. |
| Functions | |
| create | Creates the cell path for the given cell. |
| getParentPath | Returns the path for the parent of the cell represented by the given path. |
| resolve | Returns the cell for the specified cell path using the given root as the root of the path. |
| compare | Compares the given cell paths and returns -1 if p1 is smaller, 0 if p1 is equal and 1 if p1 is greater than p2. |
| mxPerimeter | Provides various perimeter functions to be used in a style as the value of mxConstants.STYLE_PERIMETER. |
| Functions | |
| RectanglePerimeter | Describes a rectangular perimeter for the given bounds. |
| EllipsePerimeter | Describes an elliptic perimeter. |
| RhombusPerimeter | Describes a rhombus (aka diamond) perimeter. |
| TrianglePerimeter | Describes a triangle perimeter. |
| HexagonPerimeter | Describes a hexagon perimeter. |
| mxPrintPreview | Implements printing of a diagram across multiple pages. |
| Functions | |
| mxPrintPreview | Constructs a new print preview for the given parameters. |
| Variables | |
| graph | Reference to the mxGraph that should be previewed. |
| pageFormat | Holds the mxRectangle that defines the page format. |
| scale | Holds the scale of the print preview. |
| border | The border inset around each side of every page in the preview. |
| marginTop | The margin at the top of the page (number). |
| marginBottom | The margin at the bottom of the page (number). |
| x0 | Holds the horizontal offset of the output. |
| y0 | Holds the vertical offset of the output. |
| autoOrigin | Specifies if the origin should be automatically computed based on the top, left corner of the actual diagram contents. |
| printOverlays | Specifies if overlays should be printed. |
| printControls | Specifies if controls (such as folding icons) should be printed. |
| printBackgroundImage | Specifies if the background image should be printed. |
| backgroundColor | Holds the color value for the page background color. |
| borderColor | Holds the color value for the page border. |
| title | Holds the title of the preview window. |
| pageSelector | Boolean that specifies if the page selector should be displayed. |
| wnd | Reference to the preview window. |
| targetWindow | Assign any window here to redirect the rendering in open. |
| pageCount | Holds the actual number of pages in the preview. |
| clipping | Specifies is clipping should be used to avoid creating too many cell states in large diagrams. |
| Functions | |
| getWindow | Returns wnd. |
| getDocType | Returns the string that should go before the HTML tag in the print preview page. |
| appendGraph | Adds the given graph to the existing print preview. |
| open | Shows the print preview window. |
| addPageBreak | Adds a page break to the given document. |
| closeDocument | Writes the closing tags for body and page after calling writePostfix. |
| writeHead | Writes the HEAD section into the given document, without the opening and closing HEAD tags. |
| writePostfix | Called before closing the body of the page. |
| createPageSelector | Creates the page selector table. |
| renderPage | Creates a DIV that prints a single page of the given graph using the given scale and returns the DIV that represents the page. |
| getRoot | Returns the root cell for painting the graph. |
| addGraphFragment | Adds a graph fragment to the given div. |
| getLinkForCellState | Returns the link for the given cell state. |
| insertBackgroundImage | Inserts the background image into the given div. |
| getCoverPages | Returns the pages to be added before the print output. |
| getAppendices | Returns the pages to be added after the print output. |
| Opens the print preview and shows the print dialog. | |
| close | Closes the print preview window. |
| mxStylesheet | Defines the appearance of the cells in a graph. |
| Functions | |
| mxStylesheet | Constructs a new stylesheet and assigns default styles. |
| styles | Maps from names to cell styles. |
| createDefaultVertexStyle | Creates and returns the default vertex style. |
| createDefaultEdgeStyle | Creates and returns the default edge style. |
| putDefaultVertexStyle | Sets the default style for vertices using defaultVertex as the stylename. |
| putDefaultEdgeStyle | Sets the default style for edges using defaultEdge as the stylename. |
| getDefaultVertexStyle | Returns the default style for vertices. |
| getDefaultEdgeStyle | Sets the default style for edges. |
| putCellStyle | Stores the given map of key, value pairs under the given name in styles. |
| getCellStyle | Returns the cell style for the specified stylename or the given defaultStyle if no style can be found for the given stylename. |
| mxCellState | Represents the current state of a cell in a given mxGraphView. |
| Functions | |
| mxCellState | Constructs a new object that represents the current state of the given cell in the specified view. |
| Variables | |
| view | Reference to the enclosing mxGraphView. |
| cell | Reference to the mxCell that is represented by this state. |
| style | Contains an array of key, value pairs that represent the style of the cell. |
| invalidStyle | Specifies if the style is invalid. |
| invalid | Specifies if the state is invalid. |
| origin | mxPoint that holds the origin for all child cells. |
| absolutePoints | Holds an array of mxPoints that represent the absolute points of an edge. |
| absoluteOffset | mxPoint that holds the absolute offset. |
| visibleSourceState | Caches the visible source terminal state. |
| visibleTargetState | Caches the visible target terminal state. |
| terminalDistance | Caches the distance between the end points for an edge. |
| length | Caches the length of an edge. |
| segments | Array of numbers that represent the cached length of each segment of the edge. |
| shape | Holds the mxShape that represents the cell graphically. |
| text | Holds the mxText that represents the label of the cell. |
| unscaledWidth | Holds the unscaled width of the state. |
| Functions | |
| getPerimeterBounds | Returns the mxRectangle that should be used as the perimeter of the cell. |
| setAbsoluteTerminalPoint | Sets the first or last point in absolutePoints depending on isSource. |
| setCursor | Sets the given cursor on the shape and text shape. |
| getVisibleTerminal | Returns the visible source or target terminal cell. |
| getVisibleTerminalState | Returns the visible source or target terminal state. |
| setVisibleTerminalState | Sets the visible source or target terminal state. |
| getCellBounds | Returns the unscaled, untranslated bounds. |
| getPaintBounds | Returns the unscaled, untranslated paint bounds. |
| updateCachedBounds | Updates the cellBounds and paintBounds. |
| setState | Copies all fields from the given state to this state. |
| clone | Returns a clone of this mxPoint. |
| destroy | Destroys the state and all associated resources. |
| mxGraphSelectionModel | Implements the selection model for a graph. |
| Events | |
| mxEvent.UNDO | Fires after the selection was changed in changeSelection. |
| mxEvent. | Fires after the selection changes by executing an mxSelectionChange. |
| Functions | |
| mxGraphSelectionModel | Constructs a new graph selection model for the given mxGraph. |
| Variables | |
| doneResource | Specifies the resource key for the status message after a long operation. |
| updatingSelectionResource | Specifies the resource key for the status message while the selection is being updated. |
| graph | Reference to the enclosing mxGraph. |
| singleSelection | Specifies if only one selected item at a time is allowed. |
| Functions | |
| isSingleSelection | Returns singleSelection as a boolean. |
| setSingleSelection | Sets the singleSelection flag. |
| isSelected | Returns true if the given mxCell is selected. |
| isEmpty | Returns true if no cells are currently selected. |
| clear | Clears the selection and fires a <change> event if the selection was not empty. |
| setCell | Selects the specified mxCell using setCells. |
| setCells | Selects the given array of mxCells and fires a <change> event. |
| getFirstSelectableCell | Returns the first selectable cell in the given array of cells. |
| addCell | Adds the given mxCell to the selection and fires a <select> event. |
| addCells | Adds the given array of mxCells to the selection and fires a <select> event. |
| removeCell | Removes the specified mxCell from the selection and fires a <select> event for the remaining cells. |
| removeCells | |
| changeSelection | Inner callback to add the specified mxCell to the selection. |
| cellAdded | Inner callback to add the specified mxCell to the selection. |
| cellRemoved | Inner callback to remove the specified mxCell from the selection. |
| mxSelectionChange | Action to change the current root in a view. |
| Functions | |
| mxCurrentRootChange | Constructs a change of the current root in the given view. |
| execute | Changes the current root of the view. |
| mxCellEditor | In-place editor for the graph. |
| Functions | |
| mxCellEditor | Constructs a new in-place editor for the specified graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| textarea | Holds the DIV that is used for text editing. |
| editingCell | Reference to the mxCell that is currently being edited. |
| trigger | Reference to the event that was used to start editing. |
| modified | Specifies if the label has been modified. |
| autoSize | Specifies if the textarea should be resized while the text is being edited. |
| selectText | Specifies if the text should be selected when editing starts. |
| emptyLabelText | Text to be displayed for empty labels. |
| escapeCancelsEditing | If true, pressing the escape key will stop editing and not accept the new value. |
| textNode | Reference to the label DOM node that has been hidden. |
| zIndex | Specifies the zIndex for the textarea. |
| minResize | Defines the minimum width and height to be used in resize. |
| wordWrapPadding | Correction factor for word wrapping width. |
| blurEnabled | If focusLost should be called if textarea loses the focus. |
| initialValue | Holds the initial editing value to check if the current value was modified. |
| align | Holds the current temporary horizontal alignment for the cell style. |
| Functions | |
| init | Creates the textarea and installs the event listeners. |
| applyValue | Called in stopEditing if cancel is false to invoke mxGraph.labelChanged. |
| setAlign | Sets the temporary horizontal alignment for the current editing session. |
| getInitialValue | Gets the initial editing value for the given cell. |
| getCurrentValue | Returns the current editing value. |
| isCancelEditingKeyEvent | Returns true if escapeCancelsEditing is true and shift, control and meta are not pressed. |
| installListeners | Installs listeners for focus, change and standard key event handling. |
| isStopEditingEvent | Returns true if the given keydown event should stop cell editing. |
| isEventSource | Returns true if this editor is the source for the given native event. |
| resize | Returns modified. |
| focusLost | Called if the textarea has lost focus. |
| getBackgroundColor | Returns the background color for the in-place editor. |
| isLegacyEditor | Returns true if max-width is not supported or if the SVG root element in in the graph does not have CSS position absolute. |
| startEditing | Starts the editor for the given cell. |
| isSelectText | Returns selectText. |
| isSelectText | Returns selectText. |
| stopEditing | Stops the editor and applies the value if cancel is false. |
| prepareTextarea | Prepares the textarea for getting its value in stopEditing. |
| isHideLabel | Returns true if the label should be hidden while the cell is being edited. |
| getMinimumSize | Returns the minimum width and height for editing the given state. |
| getEditorBounds | Returns the mxRectangle that defines the bounds of the editor. |
| getEmptyLabelText | Returns the initial label value to be used of the label of the given cell is empty. |
| getEditingCell | Returns the cell that is currently being edited or null if no cell is being edited. |
| destroy | Destroys the editor and removes all associated resources. |
| mxCellRenderer | Renders cells into a document object model. |
| Functions | |
| mxCellRenderer | arrow, rectangle, ellipse, rhombus, image, line, label, cylinder, swimlane, connector, actor and cloud. |
| Variables | |
| defaultShapes | Static array that contains the globally registered shapes which are known to all instances of this class. |
| defaultEdgeShape | Defines the default shape for edges. |
| defaultVertexShape | Defines the default shape for vertices. |
| defaultTextShape | Defines the default shape for labels. |
| legacyControlPosition | Specifies if the folding icon should ignore the horizontal orientation of a swimlane. |
| legacySpacing | Specifies if spacing and label position should be ignored if overflow is fill or width. |
| antiAlias | Anti-aliasing option for new shapes. |
| minSvgStrokeWidth | Minimum stroke width for SVG output. |
| forceControlClickHandler | Specifies if the enabled state of the graph should be ignored in the control click handler (to allow folding in disabled graphs). |
| Functions | |
| registerShape | Registers the given constructor under the specified key in this instance of the renderer. |
| initializeShape | Initializes the shape in the given state by calling its init method with the correct container after configuring it using configureShape. |
| createShape | Creates and returns the shape for the given cell state. |
| createIndicatorShape | Creates the indicator shape for the given cell state. |
| getShape | Returns the shape for the given name from defaultShapes. |
| getShapeConstructor | Returns the constructor to be used for creating the shape. |
| configureShape | Configures the shape for the given cell state. |
| postConfigureShape | Replaces any reserved words used for attributes, eg. |
| checkPlaceholderStyles | Resolves special keywords ‘inherit’, ‘indicated’ and ‘swimlane’ and sets the respective color on the shape. |
| resolveColor | Resolves special keywords ‘inherit’, ‘indicated’ and ‘swimlane’ and sets the respective color on the shape. |
| getLabelValue | Returns the value to be used for the label. |
| createLabel | Creates the label for the given cell state. |
| initializeLabel | Initiailzes the label with a suitable container. |
| createCellOverlays | Creates the actual shape for showing the overlay for the given cell state. |
| initializeOverlay | Initializes the given overlay. |
| installOverlayListeners | Installs the listeners for the given mxCellState, mxCellOverlay and mxShape that represents the overlay. |
| createControl | Creates the control for the given cell state. |
| createControlClickHandler | Hook for creating the click handler for the folding icon. |
| initControl | Initializes the given control and returns the corresponding DOM node. |
| isShapeEvent | Returns true if the event is for the shape of the given state. |
| isLabelEvent | Returns true if the event is for the label of the given state. |
| installListeners | Installs the event listeners for the given cell state. |
| redrawLabel | Redraws the label for the given cell state. |
| isTextShapeInvalid | Returns true if the style for the text shape has changed. |
| redrawLabelShape | Called to invoked redraw on the given text shape. |
| getTextScale | Returns the scaling used for the label of the given state |
| getLabelBounds | Returns the bounds to be used to draw the label of the given state. |
| rotateLabelBounds | Adds the shape rotation to the given label bounds and applies the alignment and offsets. |
| redrawCellOverlays | Redraws the overlays for the given cell state. |
| redrawControl | Redraws the control for the given cell state. |
| getControlBounds | Returns the bounds to be used to draw the control (folding icon) of the given state. |
| insertStateAfter | Inserts the given array of mxShapes after the given nodes in the DOM. |
| getShapesForState | Returns the mxShapes for the given cell state in the order in which they should appear in the DOM. |
| redraw | Updates the bounds or points and scale of the shapes for the given cell state. |
| redrawShape | Redraws the shape for the given cell state. |
| doRedrawShape | Invokes redraw on the shape of the given state. |
| isShapeInvalid | Returns true if the given shape must be repainted. |
| destroy | Destroys the shapes associated with the given cell state. |
| mxEdgeStyle | Provides various edge styles to be used as the values for mxConstants.STYLE_EDGE in a cell style. |
| Functions | |
| EntityRelation | Implements an entity relation style for edges (as used in database schema diagrams). |
| Loop | Implements a self-reference, aka. |
| ElbowConnector | Uses either SideToSide or TopToBottom depending on the horizontal flag in the cell style. |
| SideToSide | Implements a vertical elbow edge. |
| TopToBottom | Implements a horizontal elbow edge. |
| SegmentConnector | Implements an orthogonal edge style. |
| OrthConnector | Implements a local orthogonal router between the given cells. |
| mxStyleRegistry | Singleton class that acts as a global converter from string to object values in a style. |
| Variables | |
| values | Maps from strings to objects. |
| Functions | |
| putValue | Puts the given object into the registry under the given name. |
| getValue | Returns the value associated with the given name. |
| getName | Returns the name for the given value. |
| mxGraphView | Extends mxEventSource to implement a view for a graph. |
| Events | |
| mxEvent.UNDO | Fires after the root was changed in setCurrentRoot. |
| mxEvent. | Fires after the scale and translate have been changed in scaleAndTranslate. |
| mxEvent. | Fires after the scale was changed in setScale. |
| mxEvent. | Fires after the translate was changed in setTranslate. |
| mxEvent. | Fire if the current root is changed by executing an mxCurrentRootChange. |
| Functions | |
| mxGraphView | Constructs a new view for the given mxGraph. |
| Variables | |
| doneResource | Specifies the resource key for the status message after a long operation. |
| Functions | |
| updatingDocumentResource | Specifies the resource key for the status message while the document is being updated. |
| Variables | |
| allowEval | Specifies if string values in cell styles should be evaluated using mxUtils.eval. |
| captureDocumentGesture | Specifies if a gesture should be captured when it goes outside of the graph container. |
| optimizeVmlReflows | Specifies if the <canvas> should be hidden while rendering in IE8 standards mode and quirks mode. |
| rendering | Specifies if shapes should be created, updated and destroyed using the methods of mxCellRenderer in graph. |
| graph | Reference to the enclosing mxGraph. |
| currentRoot | mxCell that acts as the root of the displayed cell hierarchy. |
| graphBounds | mxRectangle that caches the scales, translated bounds of the current view. |
| scale | Specifies the scale. |
| translate | mxPoint that specifies the current translation. |
| states | mxDictionary that maps from cell IDs to mxCellStates. |
| updateStyle | Specifies if the style should be updated in each validation step. |
| lastNode | During validation, this contains the last DOM node that was processed. |
| lastHtmlNode | During validation, this contains the last HTML DOM node that was processed. |
| lastForegroundNode | During validation, this contains the last edge’s DOM node that was processed. |
| lastForegroundHtmlNode | During validation, this contains the last edge HTML DOM node that was processed. |
| Functions | |
| getGraphBounds | Returns graphBounds. |
| setGraphBounds | Sets graphBounds. |
| getBounds | Returns the union of all mxCellStates for the given array of mxCells. |
| setCurrentRoot | Sets and returns the current root and fires an <undo> event before calling mxGraph.sizeDidChange. |
| scaleAndTranslate | Sets the scale and translation and fires a scale and translate event before calling revalidate followed by mxGraph.sizeDidChange. |
| getScale | Returns the scale. |
| setScale | Sets the scale and fires a scale event before calling revalidate followed by mxGraph.sizeDidChange. |
| getTranslate | Returns the translate. |
| setTranslate | Sets the translation and fires a translate event before calling revalidate followed by mxGraph.sizeDidChange. |
| viewStateChanged | Invoked after scale and/or translate has changed. |
| refresh | Clears the view if currentRoot is not null and revalidates. |
| revalidate | Revalidates the complete view with all cell states. |
| clear | Removes the state of the given cell and all descendants if the given cell is not the current root. |
| invalidate | Invalidates the state of the given cell, all its descendants and connected edges. |
| validate | Calls validateCell and validateCellState and updates the graphBounds using getBoundingBox. |
| getEmptyBounds | Returns the bounds for an empty graph. |
| getBoundingBox | Returns the bounding box of the shape and the label for the given mxCellState and its children if recurse is true. |
| createBackgroundPageShape | Creates and returns the shape used as the background page. |
| validateBackground | Calls validateBackgroundImage and validateBackgroundPage. |
| validateBackgroundImage | Validates the background image. |
| validateBackgroundPage | Validates the background page. |
| getBackgroundPageBounds | Returns the bounds for the background page. |
| redrawBackgroundImage | Updates the bounds and redraws the background image. |
| validateCell | Recursively creates the cell state for the given cell if visible is true and the given cell is visible. |
| validateCellState | Validates and repaints the mxCellState for the given mxCell. |
| updateCellState | Updates the given mxCellState. |
| isCellCollapsed | Returns true if the children of the given cell should not be visible in the view. |
| updateVertexState | Validates the given cell state. |
| updateEdgeState | Validates the given cell state. |
| updateVertexLabelOffset | Updates the absoluteOffset of the given vertex cell state. |
| resetValidationState | Resets the current validation state. |
| stateValidated | Invoked when a state has been processed in <validatePoints>. |
| updateFixedTerminalPoints | Sets the initial absolute terminal points in the given state before the edge style is computed. |
| updateFixedTerminalPoint | Sets the fixed source or target terminal point on the given edge. |
| getFixedTerminalPoint | Returns the fixed source or target terminal point for the given edge. |
| updateBoundsFromStencil | Updates the bounds of the given cell state to reflect the bounds of the stencil if it has a fixed aspect and returns the previous bounds as an mxRectangle if the bounds have been modified or null otherwise. |
| updatePoints | Updates the absolute points in the given state using the specified array of mxPoints as the relative points. |
| transformControlPoint | Transforms the given control point to an absolute point. |
| isLoopStyleEnabled | Returns true if the given edge should be routed with mxGraph.defaultLoopStyle or the mxConstants.STYLE_LOOP defined for the given edge. |
| getEdgeStyle | Returns the edge style function to be used to render the given edge state. |
| updateFloatingTerminalPoints | Updates the terminal points in the given state after the edge style was computed for the edge. |
| updateFloatingTerminalPoint | Updates the absolute terminal point in the given state for the given start and end state, where start is the source if source is true. |
| getFloatingTerminalPoint | Returns the floating terminal point for the given edge, start and end state, where start is the source if source is true. |
| getTerminalPort | Returns an mxCellState that represents the source or target terminal or port for the given edge. |
| getPerimeterPoint | Returns an mxPoint that defines the location of the intersection point between the perimeter and the line between the center of the shape and the given point. |
| getRoutingCenterX | Returns the x-coordinate of the center point for automatic routing. |
| getRoutingCenterY | Returns the y-coordinate of the center point for automatic routing. |
| getPerimeterBounds | Returns the perimeter bounds for the given terminal, edge pair as an mxRectangle. |
| getPerimeterFunction | Returns the perimeter function for the given state. |
| getNextPoint | Returns the nearest point in the list of absolute points or the center of the opposite terminal. |
| getVisibleTerminal | Returns the nearest ancestor terminal that is visible. |
| updateEdgeBounds | Updates the given state using the bounding box of t he absolute points. |
| getPoint | Returns the absolute point on the edge for the given relative mxGeometry as an mxPoint. |
| getRelativePoint | Gets the relative point that describes the given, absolute label position for the given edge state. |
| updateEdgeLabelOffset | Updates mxCellState.absoluteOffset for the given state. |
| getState | Returns the mxCellState for the given cell. |
| isRendering | Returns rendering. |
| setRendering | Sets rendering. |
| isAllowEval | Returns allowEval. |
| setAllowEval | Sets allowEval. |
| getStates | Returns states. |
| setStates | Sets states. |
| getCellStates | Returns the mxCellStates for the given array of mxCells. |
| removeState | Removes and returns the mxCellState for the given cell. |
| createState | Creates and returns an mxCellState for the given cell and initializes it using <mxCellRenderer.initialize>. |
| getCanvas | Returns the DOM node that contains the background-, draw- and overlay- and decoratorpanes. |
| getBackgroundPane | Returns the DOM node that represents the background layer. |
| getDrawPane | Returns the DOM node that represents the main drawing layer. |
| getOverlayPane | Returns the DOM node that represents the layer above the drawing layer. |
| getDecoratorPane | Returns the DOM node that represents the topmost drawing layer. |
| isContainerEvent | Returns true if the event origin is one of the drawing panes or containers of the view. |
| isScrollEvent | Returns true if the event origin is one of the scrollbars of the container in IE. |
| init | Initializes the graph event dispatch loop for the specified container and invokes create to create the required DOM nodes for the display. |
| installListeners | Installs the required listeners in the container. |
| create | Creates the DOM nodes for the HTML display. |
| updateHtmlCanvasSize | Updates the size of the HTML canvas. |
| createHtmlPane | Creates and returns a drawing pane in HTML (DIV). |
| create | Creates the DOM nodes for the VML display. |
| createVmlPane | Creates a drawing pane in VML (group). |
| create | Creates and returns the DOM nodes for the SVG display. |
| updateContainerStyle | Updates the style of the container after installing the SVG DOM elements. |
| destroy | Destroys the view and all its resources. |
| mxCurrentRootChange | Action to change the current root in a view. |
| Functions | |
| mxCurrentRootChange | Constructs a change of the current root in the given view. |
| execute | Changes the current root of the view. |
| mxGraph | Extends mxEventSource to implement a graph component for the browser. |
| Events | |
| mxEvent.ROOT | Fires if the root in the model has changed. |
| mxEvent. | Fires between begin- and endUpdate in alignCells. |
| mxEvent. | Fires between begin- and endUpdate in flipEdge. |
| mxEvent. | Fires between begin- and endUpdate in orderCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsOrdered. |
| mxEvent. | Fires between begin- and endUpdate in groupCells. |
| mxEvent. | Fires between begin- and endUpdate in ungroupCells. |
| mxEvent. | Fires between begin- and endUpdate in removeCellsFromParent. |
| mxEvent. | Fires between begin- and endUpdate in addCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsAdded. |
| mxEvent. | Fires between begin- and endUpdate in removeCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsRemoved. |
| mxEvent. | Fires between begin- and endUpdate in splitEdge. |
| mxEvent. | Fires between begin- and endUpdate in toggleCells. |
| mxEvent. | Fires between begin- and endUpdate in foldCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsFolded. |
| mxEvent. | Fires between begin- and endUpdate in updateCellSize. |
| mxEvent. | Fires between begin- and endUpdate in resizeCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsResized. |
| mxEvent. | Fires between begin- and endUpdate in moveCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsMoved. |
| mxEvent. | Fires between begin- and endUpdate in connectCell. |
| mxEvent. | Fires between begin- and endUpdate in cellConnected. |
| mxEvent. | Fires after refresh was executed. |
| mxEvent. | Fires in click after a click event. |
| mxEvent. | Fires in dblClick after a double click. |
| mxEvent. | Fires in fireGestureEvent after a touch gesture. |
| mxEvent. | Fires in tapAndHold if a tap and hold event was detected. |
| mxEvent. | Fires in fireMouseEvent before the mouse listeners are invoked. |
| mxEvent.SIZE | Fires after sizeDidChange was executed. |
| mxEvent. | Fires before the in-place editor starts in startEditingAtCell. |
| mxEvent. | Fires after the in-place editor starts in startEditingAtCell. |
| mxEvent. | Fires after the in-place editor stops in stopEditing. |
| mxEvent. | Fires between begin- and endUpdate in cellLabelChanged. |
| mxEvent. | Fires after an overlay is added in addCellOverlay. |
| mxEvent. | Fires after an overlay is removed in removeCellOverlay and removeCellOverlays. |
| mxGraph | Constructs a new mxGraph in the specified container. |
| Variables | |
| mouseListeners | Holds the mouse event listeners. |
| isMouseDown | Holds the state of the mouse button. |
| model | Holds the mxGraphModel that contains the cells to be displayed. |
| view | Holds the mxGraphView that caches the mxCellStates for the cells. |
| stylesheet | Holds the mxStylesheet that defines the appearance of the cells. |
| selectionModel | Holds the mxGraphSelectionModel that models the current selection. |
| cellEditor | Holds the mxCellEditor that is used as the in-place editing. |
| cellRenderer | Holds the mxCellRenderer for rendering the cells in the graph. |
| multiplicities | An array of mxMultiplicities describing the allowed connections in a graph. |
| renderHint | RenderHint as it was passed to the constructor. |
| dialect | Dialect to be used for drawing the graph. |
| gridSize | Specifies the grid size. |
| gridEnabled | Specifies if the grid is enabled. |
| portsEnabled | Specifies if ports are enabled. |
| nativeDoubleClickEnabled | Specifies if native double click events should be detected. |
| doubleTapEnabled | Specifies if double taps on touch-based devices should be handled as a double click. |
| doubleTapTimeout | Specifies the timeout for double taps and non-native double clicks. |
| doubleTapTolerance | Specifies the tolerance for double taps and double clicks in quirks mode. |
| lastTouchX | Holds the x-coordinate of the last touch event for double tap detection. |
| lastTouchX | Holds the y-coordinate of the last touch event for double tap detection. |
| lastTouchTime | Holds the time of the last touch event for double click detection. |
| tapAndHoldEnabled | Specifies if tap and hold should be used for starting connections on touch-based devices. |
| tapAndHoldDelay | Specifies the time for a tap and hold. |
| tapAndHoldInProgress | True if the timer for tap and hold events is running. |
| tapAndHoldValid | True as long as the timer is running and the touch events stay within the given <tapAndHoldTolerance>. |
| initialTouchX | Holds the x-coordinate of the intial touch event for tap and hold. |
| initialTouchY | Holds the y-coordinate of the intial touch event for tap and hold. |
| tolerance | Tolerance for a move to be handled as a single click. |
| defaultOverlap | Value returned by getOverlap if isAllowOverlapParent returns true for the given cell. |
| defaultParent | Specifies the default parent to be used to insert new cells. |
| alternateEdgeStyle | Specifies the alternate edge style to be used if the main control point on an edge is being doubleclicked. |
| backgroundImage | Specifies the mxImage to be returned by getBackgroundImage. |
| pageVisible | Specifies if the background page should be visible. |
| pageBreaksVisible | Specifies if a dashed line should be drawn between multiple pages. |
| pageBreakColor | Specifies the color for page breaks. |
| pageBreakDashed | Specifies the page breaks should be dashed. |
| minPageBreakDist | Specifies the minimum distance for page breaks to be visible. |
| preferPageSize | Specifies if the graph size should be rounded to the next page number in sizeDidChange. |
| pageFormat | Specifies the page format for the background page. |
| pageScale | Specifies the scale of the background page. |
| enabled | Specifies the return value for isEnabled. |
| escapeEnabled | Specifies if mxKeyHandler should invoke escape when the escape key is pressed. |
| invokesStopCellEditing | If true, when editing is to be stopped by way of selection changing, data in diagram changing or other means stopCellEditing is invoked, and changes are saved. |
| enterStopsCellEditing | If true, pressing the enter key without pressing control or shift will stop editing and accept the new value. |
| useScrollbarsForPanning | Specifies if scrollbars should be used for panning in panGraph if any scrollbars are available. |
| exportEnabled | Specifies the return value for canExportCell. |
| importEnabled | Specifies the return value for canImportCell. |
| cellsLocked | Specifies the return value for isCellLocked. |
| cellsCloneable | Specifies the return value for isCellCloneable. |
| foldingEnabled | Specifies if folding (collapse and expand via an image icon in the graph should be enabled). |
| cellsEditable | Specifies the return value for isCellEditable. |
| cellsDeletable | Specifies the return value for isCellDeletable. |
| cellsMovable | Specifies the return value for isCellMovable. |
| edgeLabelsMovable | Specifies the return value for edges in isLabelMovable. |
| vertexLabelsMovable | Specifies the return value for vertices in isLabelMovable. |
| dropEnabled | Specifies the return value for isDropEnabled. |
| splitEnabled | Specifies if dropping onto edges should be enabled. |
| cellsResizable | Specifies the return value for isCellResizable. |
| cellsBendable | Specifies the return value for isCellsBendable. |
| cellsSelectable | Specifies the return value for isCellSelectable. |
| cellsDisconnectable | Specifies the return value for <isCellDisconntable>. |
| autoSizeCells | Specifies if the graph should automatically update the cell size after an edit. |
| autoSizeCellsOnAdd | Specifies if autoSize style should be applied when cells are added. |
| autoScroll | Specifies if the graph should automatically scroll if the mouse goes near the container edge while dragging. |
| ignoreScrollbars | Specifies if the graph should automatically scroll regardless of the scrollbars. |
| translateToScrollPosition | Specifies if the graph should automatically convert the current scroll position to a translate in the graph view when a mouseUp event is received. |
| timerAutoScroll | Specifies if autoscrolling should be carried out via mxPanningManager even if the container has scrollbars. |
| allowAutoPanning | Specifies if panning via panGraph should be allowed to implement autoscroll if no scrollbars are available in scrollPointToVisible. |
| autoExtend | Specifies if the size of the graph should be automatically extended if the mouse goes near the container edge while dragging. |
| maximumGraphBounds | mxRectangle that specifies the area in which all cells in the diagram should be placed. |
| minimumGraphSize | mxRectangle that specifies the minimum size of the graph. |
| minimumContainerSize | mxRectangle that specifies the minimum size of the <container> if resizeContainer is true. |
| maximumContainerSize | mxRectangle that specifies the maximum size of the container if resizeContainer is true. |
| resizeContainer | Specifies if the container should be resized to the graph size when the graph size has changed. |
| border | Border to be added to the bottom and right side when the container is being resized after the graph has been changed. |
| keepEdgesInForeground | Specifies if edges should appear in the foreground regardless of their order in the model. |
| keepEdgesInBackground | Specifies if edges should appear in the background regardless of their order in the model. |
| allowNegativeCoordinates | Specifies if negative coordinates for vertices are allowed. |
| constrainChildren | Specifies if a child should be constrained inside the parent bounds after a move or resize of the child. |
| constrainRelativeChildren | Specifies if child cells with relative geometries should be constrained inside the parent bounds, if constrainChildren is true, and/or the maximumGraphBounds. |
| extendParents | Specifies if a parent should contain the child bounds after a resize of the child. |
| extendParentsOnAdd | Specifies if parents should be extended according to the extendParents switch if cells are added. |
| extendParentsOnAdd | Specifies if parents should be extended according to the extendParents switch if cells are added. |
| recursiveResize | Specifies the return value for isRecursiveResize. |
| collapseToPreferredSize | Specifies if the cell size should be changed to the preferred size when a cell is first collapsed. |
| zoomFactor | Specifies the factor used for zoomIn and zoomOut. |
| keepSelectionVisibleOnZoom | Specifies if the viewport should automatically contain the selection cells after a zoom operation. |
| centerZoom | Specifies if the zoom operations should go into the center of the actual diagram rather than going from top, left. |
| resetViewOnRootChange | Specifies if the scale and translate should be reset if the root changes in the model. |
| resetEdgesOnResize | Specifies if edge control points should be reset after the resize of a connected cell. |
| resetEdgesOnMove | Specifies if edge control points should be reset after the move of a connected cell. |
| resetEdgesOnConnect | Specifies if edge control points should be reset after the the edge has been reconnected. |
| allowLoops | Specifies if loops (aka self-references) are allowed. |
| defaultLoopStyle | mxEdgeStyle to be used for loops. |
| multigraph | Specifies if multiple edges in the same direction between the same pair of vertices are allowed. |
| connectableEdges | Specifies if edges are connectable. |
| allowDanglingEdges | Specifies if edges with disconnected terminals are allowed in the graph. |
| cloneInvalidEdges | Specifies if edges that are cloned should be validated and only inserted if they are valid. |
| disconnectOnMove | Specifies if edges should be disconnected from their terminals when they are moved. |
| labelsVisible | Specifies if labels should be visible. |
| htmlLabels | Specifies the return value for isHtmlLabel. |
| swimlaneSelectionEnabled | Specifies if swimlanes should be selectable via the content if the mouse is released. |
| swimlaneNesting | Specifies if nesting of swimlanes is allowed. |
| swimlaneIndicatorColorAttribute | The attribute used to find the color for the indicator if the indicator color is set to ‘swimlane’. |
| imageBundles | Holds the list of image bundles. |
| minFitScale | Specifies the minimum scale to be applied in fit. |
| maxFitScale | Specifies the maximum scale to be applied in fit. |
| panDx | Current horizontal panning value. |
| panDy | Current vertical panning value. |
| collapsedImage | Specifies the mxImage to indicate a collapsed state. |
| expandedImage | Specifies the mxImage to indicate a expanded state. |
| warningImage | Specifies the mxImage for the image to be used to display a warning overlay. |
| alreadyConnectedResource | Specifies the resource key for the error message to be displayed in non-multigraphs when two vertices are already connected. |
| containsValidationErrorsResource | Specifies the resource key for the warning message to be displayed when a collapsed cell contains validation errors. |
| collapseExpandResource | Specifies the resource key for the tooltip on the collapse/expand icon. |
| init | Initializes the <container> and creates the respective datastructures. |
| createHandlers | Creates the tooltip-, panning-, connection- and graph-handler (in this order). |
| createTooltipHandler | Creates and returns a new mxTooltipHandler to be used in this graph. |
| createSelectionCellsHandler | Creates and returns a new mxTooltipHandler to be used in this graph. |
| createConnectionHandler | Creates and returns a new mxConnectionHandler to be used in this graph. |
| createGraphHandler | Creates and returns a new mxGraphHandler to be used in this graph. |
| createPanningHandler | Creates and returns a new mxPanningHandler to be used in this graph. |
| createPopupMenuHandler | Creates and returns a new mxPopupMenuHandler to be used in this graph. |
| createSelectionModel | Creates a new mxGraphSelectionModel to be used in this graph. |
| createStylesheet | Creates a new mxGraphSelectionModel to be used in this graph. |
| createGraphView | Creates a new mxGraphView to be used in this graph. |
| createCellRenderer | Creates a new mxCellRenderer to be used in this graph. |
| createCellEditor | Creates a new mxCellEditor to be used in this graph. |
| getModel | Returns the mxGraphModel that contains the cells. |
| getView | Returns the mxGraphView that contains the mxCellStates. |
| getStylesheet | Returns the mxStylesheet that defines the style. |
| setStylesheet | Sets the mxStylesheet that defines the style. |
| getSelectionModel | Returns the mxGraphSelectionModel that contains the selection. |
| setSelectionModel | Sets the <mxSelectionModel> that contains the selection. |
| getSelectionCellsForChanges | Returns the cells to be selected for the given array of changes. |
| graphModelChanged | Called when the graph model changes. |
| updateSelection | Removes selection cells that are not in the model from the selection. |
| processChange | Processes the given change and invalidates the respective cached data in view. |
| removeStateForCell | Removes all cached information for the given cell and its descendants. |
| Overlays | |
| addCellOverlay | Adds an mxCellOverlay for the specified cell. |
| getCellOverlays | Returns the array of mxCellOverlays for the given cell or null, if no overlays are defined. |
| removeCellOverlay | Removes and returns the given mxCellOverlay from the given cell. |
| removeCellOverlays | Removes all mxCellOverlays from the given cell. |
| clearCellOverlays | Removes all mxCellOverlays in the graph for the given cell and all its descendants. |
| setCellWarning | Creates an overlay for the given cell using the warning and image or warningImage and returns the new mxCellOverlay. |
| In-place editing | |
| startEditing | Calls startEditingAtCell using the given cell or the first selection cell. |
| startEditingAtCell | Fires a startEditing event and invokes mxCellEditor.startEditing on <editor>. |
| getEditingValue | Returns the initial value for in-place editing. |
| stopEditing | Stops the current editing and fires a <editingStopped> event. |
| labelChanged | Sets the label of the specified cell to the given value using cellLabelChanged and fires mxEvent.LABEL_CHANGED while the transaction is in progress. |
| cellLabelChanged | Sets the new label for a cell. |
| Event processing | |
| escape | Processes an escape keystroke. |
| click | Processes a singleclick on an optional cell and fires a click event. |
| dblClick | Processes a doubleclick on an optional cell and fires a <dblclick> event. |
| tapAndHold | Handles the mxMouseEvent by highlighting the mxCellState. |
| scrollPointToVisible | Scrolls the graph to the given point, extending the graph container if specified. |
| createPanningManager | Creates and returns an mxPanningManager. |
| getBorderSizes | Returns the size of the border and padding on all four sides of the container. |
| getPreferredPageSize | Returns the preferred size of the background page if preferPageSize is true. |
| fit | Scales the graph such that the complete diagram fits into <container> and returns the current scale in the view. |
| sizeDidChange | Called when the size of the graph has changed. |
| doResizeContainer | Resizes the container for the given graph width and height. |
| updatePageBreaks | Invokes from sizeDidChange to redraw the page breaks. |
| Cell styles | |
| getCellStyle | Returns an array of key, value pairs representing the cell style for the given cell. |
| postProcessCellStyle | Tries to resolve the value for the image style in the image bundles and turns short data URIs as defined in mxImageBundle to data URIs as defined in RFC 2397 of the IETF. |
| setCellStyle | Sets the style of the specified cells. |
| toggleCellStyle | Toggles the boolean value for the given key in the style of the given cell and returns the new value as 0 or 1. |
| toggleCellStyles | Toggles the boolean value for the given key in the style of the given cells and returns the new value as 0 or 1. |
| setCellStyles | Sets the key to value in the styles of the given cells. |
| toggleCellStyleFlags | Toggles the given bit for the given key in the styles of the specified cells. |
| setCellStyleFlags | Sets or toggles the given bit for the given key in the styles of the specified cells. |
| Cell alignment and orientation | |
| alignCells | Aligns the given cells vertically or horizontally according to the given alignment using the optional parameter as the coordinate. |
| flipEdge | Toggles the style of the given edge between null (or empty) and alternateEdgeStyle. |
| addImageBundle | Adds the specified mxImageBundle. |
| removeImageBundle | Removes the specified mxImageBundle. |
| getImageFromBundles | Searches all imageBundles for the specified key and returns the value for the first match or null if the key is not found. |
| Order | |
| orderCells | Moves the given cells to the front or back. |
| cellsOrdered | Moves the given cells to the front or back. |
| Grouping | |
| groupCells | Adds the cells into the given group. |
| getCellsForGroup | Returns the cells with the same parent as the first cell in the given array. |
| getBoundsForGroup | Returns the bounds to be used for the given group and children. |
| createGroupCell | Hook for creating the group cell to hold the given array of mxCells if no group cell was given to the <group> function. |
| ungroupCells | Ungroups the given cells by moving the children the children to their parents parent and removing the empty groups. |
| removeCellsAfterUngroup | Hook to remove the groups after ungroupCells. |
| removeCellsFromParent | Removes the specified cells from their parents and adds them to the default parent. |
| updateGroupBounds | Updates the bounds of the given groups to include all children and returns the passed-in cells. |
| getBoundingBox | Returns the bounding box for the given array of mxCells. |
| Cell cloning, insertion and removal | |
| cloneCell | Returns the clone for the given cell. |
| cloneCells | Returns the clones for the given cells. |
| insertVertex | Adds a new vertex into the given parent mxCell using value as the user object and the given coordinates as the mxGeometry of the new vertex. |
| createVertex | Hook method that creates the new vertex for insertVertex. |
| insertEdge | Adds a new edge into the given parent mxCell using value as the user object and the given source and target as the terminals of the new edge. |
| createEdge | Hook method that creates the new edge for insertEdge. |
| addEdge | Adds the edge to the parent and connects it to the given source and target terminals. |
| addCell | Adds the cell to the parent and connects it to the given source and target terminals. |
| addCells | Adds the cells to the parent at the given index, connecting each cell to the optional source and target terminal. |
| cellsAdded | Adds the specified cells to the given parent. |
| autoSizeCell | Resizes the specified cell to just fit around the its label and/or children |
| removeCells | Removes the given cells from the graph including all connected edges if includeEdges is true. |
| cellsRemoved | Removes the given cells from the model. |
| splitEdge | Splits the given edge by adding the newEdge between the previous source and the given cell and reconnecting the source of the given edge to the given cell. |
| Cell visibility | |
| toggleCells | Sets the visible state of the specified cells and all connected edges if includeEdges is true. |
| cellsToggled | Sets the visible state of the specified cells. |
| Folding | |
| foldCells | Sets the collapsed state of the specified cells and all descendants if recurse is true. |
| cellsFolded | Sets the collapsed state of the specified cells. |
| swapBounds | Swaps the alternate and the actual bounds in the geometry of the given cell invoking updateAlternateBounds before carrying out the swap. |
| updateAlternateBounds | Updates or sets the alternate bounds in the given geometry for the given cell depending on whether the cell is going to be collapsed. |
| addAllEdges | Returns an array with the given cells and all edges that are connected to a cell or one of its descendants. |
| getAllEdges | Returns all edges connected to the given cells or its descendants. |
| Cell sizing | |
| updateCellSize | Updates the size of the given cell in the model using cellSizeUpdated. |
| cellSizeUpdated | Updates the size of the given cell in the model using getPreferredSizeForCell to get the new size. |
| getPreferredSizeForCell | Returns the preferred width and height of the given mxCell as an mxRectangle. |
| resizeCell | Sets the bounds of the given cell using resizeCells. |
| resizeCells | Sets the bounds of the given cells and fires a mxEvent.RESIZE_CELLS event while the transaction is in progress. |
| cellsResized | Sets the bounds of the given cells and fires a mxEvent.CELLS_RESIZED event. |
| cellResized | Resizes the parents recursively so that they contain the complete area of the resized child cell. |
| resizeChildCells | Resizes the child cells of the given cell for the given new geometry with respect to the current geometry of the cell. |
| constrainChildCells | Constrains the children of the given cell using constrainChild. |
| scaleCell | Scales the points, position and size of the given cell according to the given vertical and horizontal scaling factors. |
| extendParent | Resizes the parents recursively so that they contain the complete area of the resized child cell. |
| Cell moving | |
| importCells | Clones and inserts the given cells into the graph using the move method and returns the inserted cells. |
| moveCells | Moves or clones the specified cells and moves the cells or clones by the given amount, adding them to the optional target cell. |
| cellsMoved | Moves the specified cells by the given vector, disconnecting the cells using disconnectGraph is disconnect is true. |
| translateCell | Translates the geometry of the given cell and stores the new, translated geometry in the model as an atomic change. |
| getCellContainmentArea | Returns the mxRectangle inside which a cell is to be kept. |
| getMaximumGraphBounds | Returns the bounds inside which the diagram should be kept as an mxRectangle. |
| constrainChild | Keeps the given cell inside the bounds returned by getCellContainmentArea for its parent, according to the rules defined by getOverlap and isConstrainChild. |
| resetEdges | Resets the control points of the edges that are connected to the given cells if not both ends of the edge are in the given cells array. |
| resetEdge | Resets the control points of the given edge. |
| Cell connecting and connection constraints | |
| getOutlineConstraint | Returns the constraint used to connect to the outline of the given state. |
| getAllConnectionConstraints | Returns an array of all mxConnectionConstraints for the given terminal. |
| getConnectionConstraint | Returns an mxConnectionConstraint that describes the given connection point. |
| setConnectionConstraint | Sets the mxConnectionConstraint that describes the given connection point. |
| getConnectionPoint | Returns the nearest point in the list of absolute points or the center of the opposite terminal. |
| connectCell | Connects the specified end of the given edge to the given terminal using cellConnected and fires mxEvent.CONNECT_CELL while the transaction is in progress. |
| cellConnected | Sets the new terminal for the given edge and resets the edge points if resetEdgesOnConnect is true. |
| disconnectGraph | Disconnects the given edges from the terminals which are not in the given array. |
| Drilldown | |
| getCurrentRoot | Returns the current root of the displayed cell hierarchy. |
| getTranslateForRoot | Returns the translation to be used if the given cell is the root cell as an mxPoint. |
| isPort | Returns true if the given cell is a “port”, that is, when connecting to it, the cell returned by getTerminalForPort should be used as the terminal and the port should be referenced by the ID in either the mxConstants.STYLE_SOURCE_PORT or the or the mxConstants.STYLE_TARGET_PORT. |
| getTerminalForPort | Returns the terminal to be used for a given port. |
| getChildOffsetForCell | Returns the offset to be used for the cells inside the given cell. |
| enterGroup | Uses the given cell as the root of the displayed cell hierarchy. |
| exitGroup | Changes the current root to the next valid root in the displayed cell hierarchy. |
| home | Uses the root of the model as the root of the displayed cell hierarchy and selects the previous root. |
| isValidRoot | Returns true if the given cell is a valid root for the cell display hierarchy. |
| Graph display | |
| getGraphBounds | Returns the bounds of the visible graph. |
| getCellBounds | Returns the scaled, translated bounds for the given cell. |
| getBoundingBoxFromGeometry | Returns the bounding box for the geometries of the vertices in the given array of cells. |
| refresh | Clears all cell states or the states for the hierarchy starting at the given cell and validates the graph. |
| snap | Snaps the given numeric value to the grid if gridEnabled is true. |
| panGraph | Shifts the graph display by the given amount. |
| zoomIn | Zooms into the graph by zoomFactor. |
| zoomOut | Zooms out of the graph by zoomFactor. |
| zoomActual | Resets the zoom and panning in the view. |
| zoomTo | Zooms the graph to the given scale with an optional boolean center argument, which is passd to zoom. |
| center | Centers the graph in the container. |
| zoom | Zooms the graph using the given factor. |
| zoomToRect | Zooms the graph to the specified rectangle. |
| scrollCellToVisible | Pans the graph so that it shows the given cell. |
| scrollRectToVisible | Pans the graph so that it shows the given rectangle. |
| getCellGeometry | Returns the mxGeometry for the given cell. |
| isCellVisible | Returns true if the given cell is visible in this graph. |
| isCellCollapsed | Returns true if the given cell is collapsed in this graph. |
| isCellConnectable | Returns true if the given cell is connectable in this graph. |
| isOrthogonal | Returns true if perimeter points should be computed such that the resulting edge has only horizontal or vertical segments. |
| isLoop | Returns true if the given cell state is a loop. |
| isCloneEvent | Returns true if the given event is a clone event. |
| isTransparentClickEvent | Hook for implementing click-through behaviour on selected cells. |
| isToggleEvent | Returns true if the given event is a toggle event. |
| isGridEnabledEvent | Returns true if the given mouse event should be aligned to the grid. |
| isConstrainedEvent | Returns true if the given mouse event should be aligned to the grid. |
| isIgnoreTerminalEvent | Returns true if the given mouse event should not allow any connections to be made. |
| Validation | |
| validationAlert | Displays the given validation error in a dialog. |
| isEdgeValid | Checks if the return value of getEdgeValidationError for the given arguments is null. |
| getEdgeValidationError | Returns the validation error message to be displayed when inserting or changing an edges’ connectivity. |
| validateEdge | Hook method for subclassers to return an error message for the given edge and terminals. |
| validateGraph | Validates the graph by validating each descendant of the given cell or the root of the model. |
| getCellValidationError | Checks all multiplicities that cannot be enforced while the graph is being modified, namely, all multiplicities that require a minimum of 1 edge. |
| validateCell | Hook method for subclassers to return an error message for the given cell and validation context. |
| Graph appearance | |
| getBackgroundImage | Returns the backgroundImage as an mxImage. |
| setBackgroundImage | Sets the new backgroundImage. |
| getFoldingImage | Returns the mxImage used to display the collapsed state of the specified cell state. |
| convertValueToString | Returns the textual representation for the given cell. |
| getLabel | Returns a string or DOM node that represents the label for the given cell. |
| isHtmlLabel | Returns true if the label must be rendered as HTML markup. |
| isHtmlLabels | Returns htmlLabels. |
| setHtmlLabels | Sets htmlLabels. |
| isWrapping | This enables wrapping for HTML labels. |
| isLabelClipped | Returns true if the overflow portion of labels should be hidden. |
| getTooltip | Returns the string or DOM node that represents the tooltip for the given state, node and coordinate pair. |
| getTooltipForCell | Returns the string or DOM node to be used as the tooltip for the given cell. |
| getLinkForCell | Returns the string to be used as the link for the given cell. |
| getCursorForMouseEvent | Returns the cursor value to be used for the CSS of the shape for the given event. |
| getCursorForCell | Returns the cursor value to be used for the CSS of the shape for the given cell. |
| getStartSize | Returns the start size of the given swimlane, that is, the width or height of the part that contains the title, depending on the horizontal style. |
| getImage | Returns the image URL for the given cell state. |
| getVerticalAlign | Returns the vertical alignment for the given cell state. |
| getIndicatorColor | Returns the indicator color for the given cell state. |
| getIndicatorGradientColor | Returns the indicator gradient color for the given cell state. |
| getIndicatorShape | Returns the indicator shape for the given cell state. |
| getIndicatorImage | Returns the indicator image for the given cell state. |
| getBorder | Returns the value of border. |
| setBorder | Sets the value of border. |
| isSwimlane | Returns true if the given cell is a swimlane in the graph. |
| Graph behaviour | |
| isResizeContainer | Returns resizeContainer. |
| setResizeContainer | Sets resizeContainer. |
| isEnabled | Returns true if the graph is enabled. |
| setEnabled | Specifies if the graph should allow any interactions. |
| isEscapeEnabled | Returns escapeEnabled. |
| setEscapeEnabled | Sets escapeEnabled. |
| isInvokesStopCellEditing | Returns invokesStopCellEditing. |
| setInvokesStopCellEditing | Sets invokesStopCellEditing. |
| isEnterStopsCellEditing | Returns enterStopsCellEditing. |
| setEnterStopsCellEditing | Sets enterStopsCellEditing. |
| isCellLocked | Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected. |
| isCellsLocked | Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected. |
| setCellsLocked | Sets if any cell may be moved, sized, bended, disconnected, edited or selected. |
| getCloneableCells | Returns the cells which may be exported in the given array of cells. |
| isCellCloneable | Returns true if the given cell is cloneable. |
| isCellsCloneable | Returns cellsCloneable, that is, if the graph allows cloning of cells by using control-drag. |
| setCellsCloneable | Specifies if the graph should allow cloning of cells by holding down the control key while cells are being moved. |
| getExportableCells | Returns the cells which may be exported in the given array of cells. |
| canExportCell | Returns true if the given cell may be exported to the clipboard. |
| getImportableCells | Returns the cells which may be imported in the given array of cells. |
| canImportCell | Returns true if the given cell may be imported from the clipboard. |
| isCellSelectable | Returns true if the given cell is selectable. |
| isCellsSelectable | Returns cellsSelectable. |
| setCellsSelectable | Sets cellsSelectable. |
| getDeletableCells | Returns the cells which may be exported in the given array of cells. |
| isCellDeletable | Returns true if the given cell is moveable. |
| isCellsDeletable | Returns cellsDeletable. |
| setCellsDeletable | Sets cellsDeletable. |
| isLabelMovable | Returns true if the given edges’s label is moveable. |
| isCellRotatable | Returns true if the given cell is rotatable. |
| getMovableCells | Returns the cells which are movable in the given array of cells. |
| isCellMovable | Returns true if the given cell is moveable. |
| isCellsMovable | Returns cellsMovable. |
| setCellsMovable | Specifies if the graph should allow moving of cells. |
| isGridEnabled | Returns gridEnabled as a boolean. |
| setGridEnabled | Specifies if the grid should be enabled. |
| isPortsEnabled | Returns portsEnabled as a boolean. |
| setPortsEnabled | Specifies if the ports should be enabled. |
| getGridSize | Returns gridSize. |
| setGridSize | Sets gridSize. |
| getTolerance | Returns tolerance. |
| setTolerance | Sets tolerance. |
| isVertexLabelsMovable | Returns vertexLabelsMovable. |
| setVertexLabelsMovable | Sets vertexLabelsMovable. |
| isEdgeLabelsMovable | Returns edgeLabelsMovable. |
| isEdgeLabelsMovable | Sets edgeLabelsMovable. |
| isSwimlaneNesting | Returns swimlaneNesting as a boolean. |
| setSwimlaneNesting | Specifies if swimlanes can be nested by drag and drop. |
| isSwimlaneSelectionEnabled | Returns swimlaneSelectionEnabled as a boolean. |
| setSwimlaneSelectionEnabled | Specifies if swimlanes should be selected if the mouse is released over their content area. |
| isMultigraph | Returns multigraph as a boolean. |
| setMultigraph | Specifies if the graph should allow multiple connections between the same pair of vertices. |
| isAllowLoops | Returns allowLoops as a boolean. |
| setAllowDanglingEdges | Specifies if dangling edges are allowed, that is, if edges are allowed that do not have a source and/or target terminal defined. |
| isAllowDanglingEdges | Returns allowDanglingEdges as a boolean. |
| setConnectableEdges | Specifies if edges should be connectable. |
| isConnectableEdges | Returns connectableEdges as a boolean. |
| setCloneInvalidEdges | Specifies if edges should be inserted when cloned but not valid wrt. |
| isCloneInvalidEdges | Returns cloneInvalidEdges as a boolean. |
| setAllowLoops | Specifies if loops are allowed. |
| isDisconnectOnMove | Returns disconnectOnMove as a boolean. |
| setDisconnectOnMove | Specifies if edges should be disconnected when moved. |
| isDropEnabled | Returns dropEnabled as a boolean. |
| setDropEnabled | Specifies if the graph should allow dropping of cells onto or into other cells. |
| isSplitEnabled | Returns splitEnabled as a boolean. |
| setSplitEnabled | Specifies if the graph should allow dropping of cells onto or into other cells. |
| isCellResizable | Returns true if the given cell is resizable. |
| isCellsResizable | Returns cellsResizable. |
| setCellsResizable | Specifies if the graph should allow resizing of cells. |
| isTerminalPointMovable | Returns true if the given terminal point is movable. |
| isCellBendable | Returns true if the given cell is bendable. |
| isCellsBendable | Returns <cellsBenadable>. |
| setCellsBendable | Specifies if the graph should allow bending of edges. |
| isCellEditable | Returns true if the given cell is editable. |
| isCellsEditable | Returns cellsEditable. |
| setCellsEditable | Specifies if the graph should allow in-place editing for cell labels. |
| isCellDisconnectable | Returns true if the given cell is disconnectable from the source or target terminal. |
| isCellsDisconnectable | Returns cellsDisconnectable. |
| setCellsDisconnectable | Sets cellsDisconnectable. |
| isValidSource | Returns true if the given cell is a valid source for new connections. |
| isValidTarget | Returns isValidSource for the given cell. |
| isValidConnection | Returns true if the given target cell is a valid target for source. |
| setConnectable | Specifies if the graph should allow new connections. |
| isConnectable | Returns true if the <connectionHandler> is enabled. |
| setTooltips | Specifies if tooltips should be enabled. |
| setPanning | Specifies if panning should be enabled. |
| isEditing | Returns true if the given cell is currently being edited. |
| isAutoSizeCell | Returns true if the size of the given cell should automatically be updated after a change of the label. |
| isAutoSizeCells | Returns autoSizeCells. |
| setAutoSizeCells | Specifies if cell sizes should be automatically updated after a label change. |
| isExtendParent | Returns true if the parent of the given cell should be extended if the child has been resized so that it overlaps the parent. |
| isExtendParents | Returns extendParents. |
| setExtendParents | Sets extendParents. |
| isExtendParentsOnAdd | Returns extendParentsOnAdd. |
| setExtendParentsOnAdd | Sets extendParentsOnAdd. |
| isExtendParentsOnMove | Returns <extendParentsOnMove>. |
| setExtendParentsOnMove | Sets <extendParentsOnMove>. |
| isRecursiveResize | Returns recursiveResize. |
| setRecursiveResize | Sets recursiveResize. |
| isConstrainChild | Returns true if the given cell should be kept inside the bounds of its parent according to the rules defined by getOverlap and isAllowOverlapParent. |
| isConstrainChildren | Returns constrainChildren. |
| setConstrainChildren | Sets constrainChildren. |
| isConstrainRelativeChildren | Returns constrainRelativeChildren. |
| setConstrainRelativeChildren | Sets constrainRelativeChildren. |
| isConstrainChildren | Returns allowNegativeCoordinates. |
| setConstrainChildren | Sets allowNegativeCoordinates. |
| getOverlap | Returns a decimal number representing the amount of the width and height of the given cell that is allowed to overlap its parent. |
| isAllowOverlapParent | Returns true if the given cell is allowed to be placed outside of the parents area. |
| getFoldableCells | Returns the cells which are movable in the given array of cells. |
| isCellFoldable | Returns true if the given cell is foldable. |
| isValidDropTarget | Returns true if the given cell is a valid drop target for the specified cells. |
| isSplitTarget | Returns true if the given edge may be splitted into two edges with the given cell as a new terminal between the two. |
| getDropTarget | Returns the given cell if it is a drop target for the given cells or the nearest ancestor that may be used as a drop target for the given cells. |
| Cell retrieval | |
| getDefaultParent | Returns defaultParent or mxGraphView.currentRoot or the first child child of mxGraphModel.root if both are null. |
| setDefaultParent | Sets the defaultParent to the given cell. |
| getSwimlane | Returns the nearest ancestor of the given cell which is a swimlane, or the given cell, if it is itself a swimlane. |
| getSwimlaneAt | Returns the bottom-most swimlane that intersects the given point (x, y) in the cell hierarchy that starts at the given parent. |
| getCellAt | Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy starting at the given parent. |
| intersects | Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy that starts at the given parent. |
| hitsSwimlaneContent | Returns true if the given coordinate pair is inside the content are of the given swimlane. |
| getChildVertices | Returns the visible child vertices of the given parent. |
| getChildEdges | Returns the visible child edges of the given parent. |
| getChildCells | Returns the visible child vertices or edges in the given parent. |
| getConnections | Returns all visible edges connected to the given cell without loops. |
| getIncomingEdges | Returns the visible incoming edges for the given cell. |
| getOutgoingEdges | Returns the visible outgoing edges for the given cell. |
| getEdges | Returns the incoming and/or outgoing edges for the given cell. |
| isValidAncestor | Returns whether or not the specified parent is a valid ancestor of the specified cell, either direct or indirectly based on whether ancestor recursion is enabled. |
| getOpposites | Returns all distinct visible opposite cells for the specified terminal on the given edges. |
| getEdgesBetween | Returns the edges between the given source and target. |
| getPointForEvent | Returns an mxPoint representing the given event in the unscaled, non-translated coordinate space of <container> and applies the grid. |
| getCells | Returns the child vertices and edges of the given parent that are contained in the given rectangle. |
| getCellsBeyond | Returns the children of the given parent that are contained in the halfpane from the given point (x0, y0) rightwards or downwards depending on rightHalfpane and bottomHalfpane. |
| findTreeRoots | Returns all children in the given parent which do not have incoming edges. |
| traverse | Traverses the (directed) graph invoking the given function for each visited vertex and edge. |
| Selection | |
| isCellSelected | Returns true if the given cell is selected. |
| isSelectionEmpty | Returns true if the selection is empty. |
| clearSelection | Clears the selection using mxGraphSelectionModel.clear. |
| getSelectionCount | Returns the number of selected cells. |
| getSelectionCell | Returns the first cell from the array of selected mxCells. |
| getSelectionCells | Returns the array of selected mxCells. |
| setSelectionCell | Sets the selection cell. |
| setSelectionCells | Sets the selection cell. |
| addSelectionCell | Adds the given cell to the selection. |
| addSelectionCells | Adds the given cells to the selection. |
| removeSelectionCell | Removes the given cell from the selection. |
| removeSelectionCells | Removes the given cells from the selection. |
| selectRegion | Selects and returns the cells inside the given rectangle for the specified event. |
| selectNextCell | Selects the next cell. |
| selectPreviousCell | Selects the previous cell. |
| selectParentCell | Selects the parent cell. |
| selectChildCell | Selects the first child cell. |
| selectCell | Selects the next, parent, first child or previous cell, if all arguments are false. |
| selectAll | Selects all children of the given parent cell or the children of the default parent if no parent is specified. |
| selectVertices | Select all vertices inside the given parent or the default parent. |
| selectVertices | Select all vertices inside the given parent or the default parent. |
| selectCells | Selects all vertices and/or edges depending on the given boolean arguments recursively, starting at the given parent or the default parent if no parent is specified. |
| selectCellForEvent | Selects the given cell by either adding it to the selection or replacing the selection depending on whether the given mouse event is a toggle event. |
| selectCellsForEvent | Selects the given cells by either adding them to the selection or replacing the selection depending on whether the given mouse event is a toggle event. |
| Selection state | |
| createHandler | Creates a new handler for the given cell state. |
| createVertexHandler | Hooks to create a new mxVertexHandler for the given mxCellState. |
| createEdgeHandler | Hooks to create a new mxEdgeHandler for the given mxCellState. |
| createEdgeSegmentHandler | Hooks to create a new <mxEdgeSegmentHandler> for the given mxCellState. |
| createElbowEdgeHandler | Hooks to create a new mxElbowEdgeHandler for the given mxCellState. |
| Graph events | |
| addMouseListener | Adds a listener to the graph event dispatch loop. |
| removeMouseListener | Removes the specified graph listener. |
| updateMouseEvent | Sets the graphX and graphY properties if the given mxMouseEvent if required and returned the event. |
| getStateForEvent | Returns the state for the given touch event. |
| isEventIgnored | Returns true if the event should be ignored in fireMouseEvent. |
| isSyntheticEventIgnored | Hook for ignoring synthetic mouse events after touchend in Firefox. |
| isEventSourceIgnored | Returns true if the event should be ignored in fireMouseEvent. |
| getEventState | Returns the mxCellState to be used when firing the mouse event for the given state. |
| fireMouseEvent | Dispatches the given event in the graph event dispatch loop. |
| consumeMouseEvent | Consumes the given mxMouseEvent if it’s a touchStart event. |
| fireGestureEvent | Dispatches a mxEvent.GESTURE event. |
| destroy | Destroys the graph and all its resources. |
| mxCellOverlay | Extends mxEventSource to implement a graph overlay, represented by an icon and a tooltip. |
| Events | |
| mxEvent. | Fires when the user clicks on the overlay. |
| Functions | |
| mxCellOverlay | Constructs a new overlay using the given image and tooltip. |
| Variables | |
| image | Holds the mxImage to be used as the icon. |
| tooltip | Holds the optional string to be used as the tooltip. |
| align | Holds the horizontal alignment for the overlay. |
| verticalAlign | Holds the vertical alignment for the overlay. |
| offset | Holds the offset as an mxPoint. |
| cursor | Holds the cursor for the overlay. |
| defaultOverlap | Defines the overlapping for the overlay, that is, the proportional distance from the origin to the point defined by the alignment. |
| Functions | |
| getBounds | Returns the bounds of the overlay for the given mxCellState as an mxRectangle. |
| toString | Returns the textual representation of the overlay to be used as the tooltip. |
| mxOutline | Implements an outline (aka overview) for a graph. |
| Functions | |
| mxOutline | Constructs a new outline for the specified graph inside the given container. |
| source | Reference to the source mxGraph. |
| outline | Reference to the mxGraph that renders the outline. |
| graphRenderHint | Renderhint to be used for the outline graph. |
| Variables | |
| enabled | Specifies if events are handled. |
| showViewport | Specifies a viewport rectangle should be shown. |
| border | Border to be added at the bottom and right. |
| enabled | Specifies the size of the sizer handler. |
| labelsVisible | Specifies if labels should be visible in the outline. |
| updateOnPan | Specifies if update should be called for mxEvent.PAN in the source graph. |
| sizerImage | Optional mxImage to be used for the sizer. |
| minScale | Minimum scale to be used. |
| suspended | Optional boolean flag to suspend updates. |
| forceVmlHandles | Specifies if VML should be used to render the handles in this control. |
| Functions | |
| createGraph | Creates the mxGraph used in the outline. |
| init | Initializes the outline inside the given container. |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| setZoomEnabled | Enables or disables the zoom handling by showing or hiding the respective handle. |
| refresh | Invokes update and revalidate the outline. |
| createSizer | Creates the shape used as the sizer. |
| getSourceContainerSize | Returns the size of the source container. |
| getOutlineOffset | Returns the offset for drawing the outline graph. |
| getOutlineOffset | Returns the offset for drawing the outline graph. |
| update | Updates the outline. |
| mouseDown | Handles the event by starting a translation or zoom. |
| mouseMove | Handles the event by previewing the viewrect in <graph> and updating the rectangle that represents the viewrect in the outline. |
| getTranslateForEvent | Gets the translate for the given mouse event. |
| mouseUp | Handles the event by applying the translation or zoom to <graph>. |
| destroy | Destroy this outline and removes all listeners from source. |
| mxMultiplicity | Defines invalid connections along with the error messages that they produce. |
| Functions | |
| mxMultiplicity | Instantiate class mxMultiplicity in order to describe allowed connections in a graph. |
| Variables | |
| type | Defines the type of the source or target terminal. |
| attr | Optional string that specifies the attributename to be passed to mxUtils.isNode to check if the rule applies to a cell. |
| value | Optional string that specifies the value of the attribute to be passed to mxUtils.isNode to check if the rule applies to a cell. |
| source | Boolean that specifies if the rule is applied to the source or target terminal of an edge. |
| min | Defines the minimum number of connections for which this rule applies. |
| max | Defines the maximum number of connections for which this rule applies. |
| validNeighbors | Holds an array of strings that specify the type of neighbor for which this rule applies. |
| validNeighborsAllowed | Boolean indicating if the list of validNeighbors are those that are allowed for this rule or those that are not allowed for this rule. |
| countError | Holds the localized error message to be displayed if the number of connections for which the rule applies is smaller than min or greater than max. |
| typeError | Holds the localized error message to be displayed if the type of the neighbor for a connection does not match the rule. |
| Functions | |
| check | Checks the multiplicity for the given arguments and returns the error for the given connection or null if the multiplicity does not apply. |
| checkNeighbors | Checks if there are any valid neighbours in validNeighbors. |
| checkTerminal | Checks the given terminal cell and returns true if this rule applies. |
| checkType | Checks the type of the given value. |
| mxLayoutManager | |
| Events | |
| mxEvent. | Fires between begin- and endUpdate after all cells have been layouted in layoutCells. |
| Functions | |
| mxLayoutManager | Constructs a new automatic layout for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| bubbling | Specifies if the layout should bubble along the cell hierarchy. |
| enabled | Specifies if event handling is enabled. |
| updateHandler | Holds the function that handles the endUpdate event. |
| moveHandler | Holds the function that handles the move event. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isBubbling | Returns true if a layout should bubble, that is, if the parent layout should be executed whenever a cell layout (layout of the children of a cell) has been executed. |
| setBubbling | Sets bubbling. |
| getGraph | Returns the graph that this layout operates on. |
| setGraph | Sets the graph that the layouts operate on. |
| getLayout | Returns the layout to be executed for the given graph and parent. |
| beforeUndo | Called from the undoHandler. |
| executeLayout | Executes the given layout on the given parent. |
| cellsMoved | Called from the moveHandler. |
| getCellsForEdit | Returns the cells to be layouted for the given sequence of changes. |
| getCellsForChange | Executes all layouts which have been scheduled during the changes. |
| layoutCells | Executes all layouts which have been scheduled during the changes. |
| executeLayout | Executes the given layout on the given parent. |
| destroy | Removes all handlers from the graph and deletes the reference to it. |
| mxSwimlaneManager | Manager for swimlanes and nested swimlanes that sets the size of newly added swimlanes to that of their siblings, and propagates changes to the size of a swimlane to its siblings, if <siblings> is true, and its ancestors, if <bubbling> is true. |
| Functions | |
| mxSwimlaneManager | Constructs a new swimlane manager for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if event handling is enabled. |
| horizontal | Specifies the orientation of the swimlanes. |
| addEnabled | Specifies if newly added cells should be resized to match the size of their existing siblings. |
| resizeEnabled | Specifies if resizing of swimlanes should be handled. |
| moveHandler | Holds the function that handles the move event. |
| moveHandler | Holds the function that handles the move event. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isHorizontal | Returns horizontal. |
| setHorizontal | Sets horizontal. |
| isAddEnabled | Returns addEnabled. |
| setAddEnabled | Sets addEnabled. |
| isResizeEnabled | Returns resizeEnabled. |
| setResizeEnabled | Sets resizeEnabled. |
| getGraph | Returns the graph that this manager operates on. |
| setGraph | Sets the graph that the manager operates on. |
| isSwimlaneIgnored | Returns true if the given swimlane should be ignored. |
| isCellHorizontal | Returns true if the given cell is horizontal. |
| cellsAdded | Called if any cells have been added. |
| swimlaneAdded | Updates the size of the given swimlane to match that of any existing siblings swimlanes. |
| cellsResized | Called if any cells have been resizes. |
| resizeSwimlane | Called from cellsResized for all swimlanes that are not ignored to update the size of the siblings and the size of the parent swimlanes, recursively, if <bubbling> is true. |
| destroy | Removes all handlers from the graph and deletes the reference to it. |
| mxTemporaryCellStates | Creates a temporary set of cell states. |
| Variables | |
| view | Holds the width of the rectangle. |
| oldStates | Holds the height of the rectangle. |
| oldBounds | Holds the height of the rectangle. |
| oldScale | Holds the height of the rectangle. |
| Functions | |
| destroy | Returns the top, left corner as a new mxPoint. |
| mxCellStatePreview | Implements a live preview for moving cells. |
| Functions | |
| mxCellStatePreview | Constructs a move preview for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| deltas | Reference to the enclosing mxGraph. |
| count | Contains the number of entries in the map. |
| Functions | |
| isEmpty | Returns true if this contains no entries. |
| moveState | |
| show | |
| translateState | |
| revalidateState | |
| addEdges | |
| mxConnectionConstraint | Defines an object that contains the constraints about how to connect one side of an edge to its terminal. |
| Functions | |
| mxConnectionConstraint | Constructs a new connection constraint for the given point and boolean arguments. |
| Variables | |
| point | mxPoint that specifies the fixed location of the connection point. |
| perimeter | Boolean that specifies if the point should be projected onto the perimeter of the terminal. |
| name | Optional string that specifies the name of the constraint. |
| dx | Optional float that specifies the horizontal offset of the constraint. |
| dy | Optional float that specifies the vertical offset of the constraint. |
| mxGraphHandler | Graph event handler that handles selection. |
| Functions | |
| mxGraphHandler | Constructs an event handler that creates handles for the selection cells. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| maxCells | Defines the maximum number of cells to paint subhandles for. |
| enabled | Specifies if events are handled. |
| highlightEnabled | Specifies if drop targets under the mouse should be enabled. |
| cloneEnabled | Specifies if cloning by control-drag is enabled. |
| moveEnabled | Specifies if moving is enabled. |
| guidesEnabled | Specifies if other cells should be used for snapping the right, center or left side of the current selection. |
| guide | Holds the mxGuide instance that is used for alignment. |
| currentDx | Stores the x-coordinate of the current mouse move. |
| currentDy | Stores the y-coordinate of the current mouse move. |
| updateCursor | Specifies if a move cursor should be shown if the mouse is over a movable cell. |
| selectEnabled | Specifies if selecting is enabled. |
| removeCellsFromParent | Specifies if cells may be moved out of their parents. |
| removeEmptyParents | If empty parents should be removed from the model after all child cells have been moved out. |
| connectOnDrop | Specifies if drop events are interpreted as new connections if no other drop action is defined. |
| scrollOnMove | Specifies if the view should be scrolled so that a moved cell is visible. |
| minimumSize | Specifies the minimum number of pixels for the width and height of a selection border. |
| previewColor | Specifies the color of the preview shape. |
| htmlPreview | Specifies if the graph container should be used for preview. |
| shape | Reference to the mxShape that represents the preview. |
| scaleGrid | Specifies if the grid should be scaled. |
| rotationEnabled | Specifies if the bounding box should allow for rotation. |
| Functions | |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| isCloneEnabled | Returns cloneEnabled. |
| setCloneEnabled | Sets cloneEnabled. |
| isMoveEnabled | Returns moveEnabled. |
| setMoveEnabled | Sets moveEnabled. |
| isSelectEnabled | Returns selectEnabled. |
| setSelectEnabled | Sets selectEnabled. |
| isRemoveCellsFromParent | Returns removeCellsFromParent. |
| setRemoveCellsFromParent | Sets removeCellsFromParent. |
| getInitialCellForEvent | Hook to return initial cell for the given event. |
| isDelayedSelection | Hook to return true for delayed selections. |
| consumeMouseEvent | Consumes the given mouse event. |
| mouseDown | Handles the event by selecing the given cell and creating a handle for it. |
| getGuideStates | Creates an array of cell states which should be used as guides. |
| getCells | Returns the cells to be modified by this handler. |
| getPreviewBounds | Returns the mxRectangle used as the preview bounds for moving the given cells. |
| getBoundingBox | Returns the union of the mxCellStates for the given array of mxCells. |
| createPreviewShape | Creates the shape used to draw the preview for the given bounds. |
| start | Starts the handling of the mouse gesture. |
| useGuidesForEvent | Returns true if the guides should be used for the given mxMouseEvent. |
| snap | Snaps the given vector to the grid and returns the given mxPoint instance. |
| getDelta | Returns an mxPoint that represents the vector for moving the cells for the given mxMouseEvent. |
| updateHint | Hook for subclassers do show details while the handler is active. |
| removeHint | Hooks for subclassers to hide details when the handler gets inactive. |
| roundLength | Hook for rounding the unscaled vector. |
| mouseMove | Handles the event by highlighting possible drop targets and updating the preview. |
| updatePreviewShape | Updates the bounds of the preview shape. |
| setHighlightColor | Sets the color of the rectangle used to highlight drop targets. |
| mouseUp | Handles the event by applying the changes to the selection cells. |
| selectDelayed | Implements the delayed selection for the given mouse event. |
| reset | Resets the state of this handler. |
| shouldRemoveCellsFromParent | Returns true if the given cells should be removed from the parent for the specified mousereleased event. |
| moveCells | Moves the given cells by the specified amount. |
| moveCells | Moves the given cells by the specified amount. |
| destroyShapes | Destroy the preview and highlight shapes. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxPanningHandler | Event handler that pans and creates popupmenus. |
| Functions | |
| mxPanningHandler | Constructs an event handler that creates a mxPopupMenu and pans the graph. |
| Events | |
| mxEvent. | Fires when the panning handler changes its <active> state to true. |
| mxEvent.PAN | Fires while handle is processing events. |
| mxEvent. | Fires when the panning handler changes its <active> state to false. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| useLeftButtonForPanning | Specifies if panning should be active for the left mouse button. |
| usePopupTrigger | Specifies if mxEvent.isPopupTrigger should also be used for panning. |
| ignoreCell | Specifies if panning should be active even if there is a cell under the mousepointer. |
| previewEnabled | Specifies if the panning should be previewed. |
| useGrid | Specifies if the panning steps should be aligned to the grid size. |
| panningEnabled | Specifies if panning should be enabled. |
| pinchEnabled | Specifies if pinch gestures should be handled as zoom. |
| maxScale | Specifies the maximum scale. |
| minScale | Specifies the minimum scale. |
| dx | Holds the current horizontal offset. |
| dy | Holds the current vertical offset. |
| startX | Holds the x-coordinate of the start point. |
| startY | Holds the y-coordinate of the start point. |
| Functions | |
| isActive | Returns true if the handler is currently active. |
| isPanningEnabled | Returns panningEnabled. |
| setPanningEnabled | Sets panningEnabled. |
| isPinchEnabled | Returns pinchEnabled. |
| setPinchEnabled | Sets pinchEnabled. |
| isPanningTrigger | Returns true if the given event is a panning trigger for the optional given cell. |
| isForcePanningEvent | Returns true if the given mxMouseEvent should start panning. |
| mouseDown | Handles the event by initiating the panning. |
| start | Starts panning at the given event. |
| consumePanningTrigger | Consumes the given mxMouseEvent if it was a panning trigger in mouseDown. |
| mouseMove | Handles the event by updating the panning on the graph. |
| mouseUp | Handles the event by setting the translation on the view or showing the popupmenu. |
| mouseUp | Handles the event by setting the translation on the view or showing the popupmenu. |
| panGraph | Pans graph by the given amount. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxPopupMenuHandler | Event handler that creates popupmenus. |
| Functions | |
| mxPopupMenuHandler | Constructs an event handler that creates a mxPopupMenu. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| selectOnPopup | Specifies if cells should be selected if a popupmenu is displayed for them. |
| clearSelectionOnBackground | Specifies if cells should be deselected if a popupmenu is displayed for the diagram background. |
| triggerX | X-coordinate of the mouse down event. |
| triggerY | Y-coordinate of the mouse down event. |
| screenX | Screen X-coordinate of the mouse down event. |
| screenY | Screen Y-coordinate of the mouse down event. |
| Functions | |
| init | Initializes the shapes required for this vertex handler. |
| isSelectOnPopup | Hook for returning if a cell should be selected for a given mxMouseEvent. |
| mouseDown | Handles the event by initiating the panning. |
| mouseMove | Handles the event by updating the panning on the graph. |
| mouseUp | Handles the event by setting the translation on the view or showing the popupmenu. |
| getCellForPopupEvent | Hook to return the cell for the mouse up popup trigger handling. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxCellMarker | A helper class to process mouse locations and highlight cells. |
| Events | |
| mxEvent.MARK | Fires after a cell has been marked or unmarked. |
| Functions | |
| mxCellMarker | Constructs a new cell marker. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if the marker is enabled. |
| hotspot | Specifies the portion of the width and height that should trigger a highlight. |
| hotspotEnabled | Specifies if the hotspot is enabled. |
| validColor | Holds the valid marker color. |
| invalidColor | Holds the invalid marker color. |
| currentColor | Holds the current marker color. |
| validState | Holds the marked mxCellState if it is valid. |
| markedState | Holds the marked mxCellState. |
| Functions | |
| setEnabled | Enables or disables event handling. |
| isEnabled | Returns true if events are handled. |
| setHotspot | Sets the hotspot. |
| getHotspot | Returns the hotspot. |
| setHotspotEnabled | Specifies whether the hotspot should be used in intersects. |
| isHotspotEnabled | Returns true if hotspot is used in intersects. |
| hasValidState | Returns true if validState is not null. |
| getValidState | Returns the validState. |
| getMarkedState | Returns the markedState. |
| reset | Resets the state of the cell marker. |
| process | Processes the given event and cell and marks the state returned by getState with the color returned by getMarkerColor. |
| setCurrentState | Sets and marks the current valid state. |
| markCell | Marks the given cell using the given color, or validColor if no color is specified. |
| mark | Marks the markedState and fires a mark event. |
| unmark | Hides the marker and fires a mark event. |
| isValidState | Returns true if the given mxCellState is a valid state. |
| getMarkerColor | Returns the valid- or invalidColor depending on the value of isValid. |
| getState | Uses getCell, getStateToMark and intersects to return the mxCellState for the given mxMouseEvent. |
| getCell | Returns the mxCell for the given event and cell. |
| getStateToMark | Returns the mxCellState to be marked for the given mxCellState under the mouse. |
| intersects | Returns true if the given coordinate pair intersects the given state. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxSelectionCellsHandler | An event handler that manages cell handlers and invokes their mouse event processing functions. |
| Events | |
| mxEvent.ADD | Fires if a cell has been added to the selection. |
| mxEvent. | Fires if a cell has been remove from the selection. |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if events are handled. |
| refreshHandler | Keeps a reference to an event listener for later removal. |
| maxHandlers | Defines the maximum number of handlers to paint individually. |
| handlers | mxDictionary that maps from cells to handlers. |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| getHandler | Returns the handler for the given cell. |
| reset | Resets all handlers. |
| refresh | Reloads or updates all handlers. |
| isHandlerActive | Returns true if the given handler is active and should not be redrawn. |
| updateHandler | Updates the handler for the given shape if one exists. |
| mouseDown | Redirects the given event to the handlers. |
| mouseMove | Redirects the given event to the handlers. |
| mouseUp | Redirects the given event to the handlers. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxConnectionHandler | Graph event handler that creates new connections. |
| Events | |
| mxEvent. | Fires when a new connection is being created by the user. |
| mxEvent. | Fires between begin- and endUpdate in connect. |
| mxEvent. | Fires when the reset method is invoked. |
| mxConnectionHandler | Constructs an event handler that connects vertices using the specified factory method to create the new edges. |
| graph | Reference to the enclosing mxGraph. |
| factoryMethod | Function that is used for creating new edges. |
| moveIconFront | Specifies if icons should be displayed inside the graph container instead of the overlay pane. |
| moveIconBack | Specifies if icons should be moved to the back of the overlay pane. |
| connectImage | mxImage that is used to trigger the creation of a new connection. |
| targetConnectImage | Specifies if the connect icon should be centered on the target state while connections are being previewed. |
| enabled | Specifies if events are handled. |
| select | Specifies if new edges should be selected. |
| createTarget | Specifies if createTargetVertex should be called if no target was under the mouse for the new connection. |
| marker | Holds the <mxTerminalMarker> used for finding source and target cells. |
| constraintHandler | Holds the mxConstraintHandler used for drawing and highlighting constraints. |
| error | Holds the current validation error while connections are being created. |
| waypointsEnabled | Specifies if single clicks should add waypoints on the new edge. |
| ignoreMouseDown | Specifies if the connection handler should ignore the state of the mouse button when highlighting the source. |
| first | Holds the mxPoint where the mouseDown took place while the handler is active. |
| connectIconOffset | Holds the offset for connect icons during connection preview. |
| edgeState | Optional mxCellState that represents the preview edge while the handler is active. |
| changeHandler | Holds the change event listener for later removal. |
| drillHandler | Holds the drill event listener for later removal. |
| mouseDownCounter | Counts the number of mouseDown events since the start. |
| movePreviewAway | Switch to enable moving the preview away from the mousepointer. |
| outlineConnect | Specifies if connections to the outline of a highlighted target should be enabled. |
| livePreview | Specifies if the actual shape of the edge state should be used for the preview. |
| cursor | Specifies the cursor to be used while the handler is active. |
| insertBeforeSource | Specifies if new edges should be inserted before the source vertex in the cell hierarchy. |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isInsertBefore | Returns insertBeforeSource for non-loops and false for loops. |
| isCreateTarget | Returns createTarget. |
| setCreateTarget | Sets createTarget. |
| createShape | Creates the preview shape for new connections. |
| init | Initializes the shapes required for this connection handler. |
| isConnectableCell | Returns true if the given cell is connectable. |
| createMarker | Creates and returns the mxCellMarker used in marker. |
| start | Starts a new connection for the given state and coordinates. |
| isConnecting | Returns true if the source terminal has been clicked and a new connection is currently being previewed. |
| isValidSource | Returns mxGraph.isValidSource for the given source terminal. |
| isValidTarget | Returns true. |
| validateConnection | Returns the error message or an empty string if the connection for the given source target pair is not valid. |
| getConnectImage | Hook to return the mxImage used for the connection icon of the given mxCellState. |
| isMoveIconToFrontForState | Returns true if the state has a HTML label in the graph’s container, otherwise it returns moveIconFront. |
| createIcons | Creates the array mxImageShapes that represent the connect icons for the given mxCellState. |
| redrawIcons | Redraws the given array of mxImageShapes. |
| redrawIcons | Redraws the given array of mxImageShapes. |
| destroyIcons | Destroys the connect icons and resets the respective state. |
| isStartEvent | Returns true if the given mouse down event should start this handler. |
| mouseDown | Handles the event by initiating a new connection. |
| isImmediateConnectSource | Returns true if a tap on the given source state should immediately start connecting. |
| createEdgeState | Hook to return an mxCellState which may be used during the preview. |
| isOutlineConnectEvent | Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed. |
| updateCurrentState | Updates the current state for a given mouse move event by using the marker. |
| isCellEnabled | Returns true if the given cell does not allow new connections to be created. |
| convertWaypoint | Converts the given point from screen coordinates to model coordinates. |
| snapToPreview | Called to snap the given point to the current preview. |
| mouseMove | Handles the event by updating the preview edge or by highlighting a possible source or target terminal. |
| updateEdgeState | Updates edgeState. |
| getTargetPerimeterPoint | Returns the perimeter point for the given target state. |
| getSourcePerimeterPoint | Hook to update the icon position(s) based on a mouseOver event. |
| updateIcons | Hook to update the icon position(s) based on a mouseOver event. |
| isStopEvent | Returns true if the given mouse up event should stop this handler. |
| addWaypoint | Adds the waypoint for the given event to <waypoints>. |
| checkConstraints | Returns true if the connection for the given constraints is valid. |
| mouseUp | Handles the event by inserting the new connection. |
| reset | Resets the state of this handler. |
| drawPreview | Redraws the preview edge using the color and width returned by getEdgeColor and getEdgeWidth. |
| getEdgeColor | Returns the color used to draw the preview edge. |
| getEdgeColor | Returns the color used to draw the preview edge. |
| getEdgeWidth | Returns the width used to draw the preview edge. |
| connect | Connects the given source and target using a new edge. |
| selectCells | Selects the given edge after adding a new connection. |
| insertEdge | Creates, inserts and returns the new edge for the given parameters. |
| createTargetVertex | Hook method for creating new vertices on the fly if no target was under the mouse. |
| getAlignmentTolerance | Returns the tolerance for aligning new targets to sources. |
| createEdge | Creates and returns a new edge using factoryMethod if one exists. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxConstraintHandler | Handles constraints on connection targets. |
| Functions | |
| mxConstraintHandler | Constructs an new constraint handler. |
| Variables | |
| pointImage | mxImage to be used as the image for fixed connection points. |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if events are handled. |
| highlightColor | Specifies the color for the highlight. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| reset | Resets the state of this handler. |
| getTolerance | Returns the tolerance to be used for intersecting connection points. |
| getImageForConstraint | Returns the tolerance to be used for intersecting connection points. |
| isEventIgnored | Returns true if the given mxMouseEvent should be ignored in update. |
| isStateIgnored | Returns true if the given state should be ignored. |
| destroyIcons | Destroys the <focusIcons> if they exist. |
| destroyFocusHighlight | Destroys the <focusHighlight> if one exists. |
| isKeepFocusEvent | Returns true if the current focused state should not be changed for the given event. |
| getCellForEvent | Returns the cell for the given event. |
| update | Updates the state of this handler based on the given mxMouseEvent. |
| redraw | Transfers the focus to the given state as a source or target terminal. |
| setFocus | Transfers the focus to the given state as a source or target terminal. |
| createHighlightShape | Create the shape used to paint the highlight. |
| intersects | Returns true if the given icon intersects the given rectangle. |
| destroy | Destroy this handler. |
| mxRubberband | Event handler that selects rectangular regions. |
| Functions | |
| mxRubberband | Constructs an event handler that selects rectangular regions in the graph using rubberband selection. |
| Variables | |
| defaultOpacity | Specifies the default opacity to be used for the rubberband div. |
| enabled | Specifies if events are handled. |
| div | Holds the DIV element which is currently visible. |
| sharedDiv | Holds the DIV element which is used to display the rubberband. |
| currentX | Holds the value of the x argument in the last call to update. |
| currentY | Holds the value of the y argument in the last call to update. |
| fadeOut | Optional fade out effect. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isForceRubberbandEvent | Returns true if the given mxMouseEvent should start rubberband selection. |
| mouseDown | Handles the event by initiating a rubberband selection. |
| start | Sets the start point for the rubberband selection. |
| mouseMove | Handles the event by updating therubberband selection. |
| createShape | Creates the rubberband selection shape. |
| isActive | Returns true if this handler is active. |
| mouseUp | Handles the event by selecting the region of the rubberband using mxGraph.selectRegion. |
| execute | Resets the state of this handler and selects the current region for the given event. |
| reset | Resets the state of the rubberband selection. |
| update | Sets currentX and currentY and calls repaint. |
| repaint | Computes the bounding box and updates the style of the div. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxHandle | Implements a single custom handle for vertices. |
| Functions | |
| mxHandle | Constructs a new handle for the given state. |
| Variables | |
| cursor | Specifies the cursor to be used for this handle. |
| image | Specifies the mxImage to be used to render the handle. |
| image | Specifies the mxImage to be used to render the handle. |
| Functions | |
| getPosition | Hook for subclassers to return the current position of the handle. |
| setPosition | Hooks for subclassers to update the style in the <state>. |
| execute | Hook for subclassers to execute the handle. |
| copyStyle | Sets the cell style with the given name to the corresponding value in <state>. |
| processEvent | Processes the given mxMouseEvent and invokes setPosition. |
| positionChanged | Called after setPosition has been called in processEvent. |
| getRotation | Returns the rotation defined in the style of the cell. |
| getTotalRotation | Returns the rotation from the style and the rotation from the direction of the cell. |
| init | Creates and initializes the shapes required for this handle. |
| createShape | Creates and returns the shape for this handle. |
| initShape | Initializes <shape> and sets its cursor. |
| redraw | Renders the shape for this handle. |
| isHtmlRequired | Returns true if this handle should be rendered in HTML. |
| rotatePoint | Rotates the point by the given angle. |
| flipPoint | Flips the given point vertically and/or horizontally. |
| snapPoint | Snaps the given point to the grid if ignore is false. |
| setVisible | Shows or hides this handle. |
| reset | Resets the state of this handle by setting its visibility to true. |
| destroy | Destroys this handle. |
| mxVertexHandler | Event handler for resizing cells. |
| Functions | |
| mxVertexHandler | Constructs an event handler that allows to resize vertices and groups. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| state | Reference to the mxCellState being modified. |
| singleSizer | Specifies if only one sizer handle at the bottom, right corner should be used. |
| index | Holds the index of the current handle. |
| allowHandleBoundsCheck | Specifies if the bounds of handles should be used for hit-detection in IE or if tolerance > 0. |
| handleImage | Optional mxImage to be used as handles. |
| tolerance | Optional tolerance for hit-detection in getHandleForEvent. |
| rotationEnabled | Specifies if a rotation handle should be visible. |
| parentHighlightEnabled | Specifies if the parent should be highlighted if a child cell is selected. |
| rotationRaster | Specifies if rotation steps should be “rasterized” depening on the distance to the handle. |
| rotationCursor | Specifies the cursor for the rotation handle. |
| livePreview | Specifies if resize should change the cell in-place. |
| manageSizers | Specifies if sizers should be hidden and spaced if the vertex is small. |
| constrainGroupByChildren | Specifies if the size of groups should be constrained by the children. |
| rotationHandleVSpacing | Vertical spacing for rotation icon. |
| horizontalOffset | The horizontal offset for the handles. |
| verticalOffset | The horizontal offset for the handles. |
| Functions | |
| init | Initializes the shapes required for this vertex handler. |
| isRotationHandleVisible | Returns true if the rotation handle should be showing. |
| isConstrainedEvent | Returns true if the aspect ratio if the cell should be maintained. |
| isCenteredEvent | Returns true if the center of the vertex should be maintained during the resize. |
| createCustomHandles | Returns an array of custom handles. |
| updateMinBounds | Initializes the shapes required for this vertex handler. |
| getSelectionBounds | Returns the mxRectangle that defines the bounds of the selection border. |
| createParentHighlightShape | Creates the shape used to draw the selection border. |
| createSelectionShape | Creates the shape used to draw the selection border. |
| getSelectionColor | Returns mxConstants.VERTEX_SELECTION_COLOR. |
| getSelectionStrokeWidth | Returns mxConstants.VERTEX_SELECTION_STROKEWIDTH. |
| isSelectionDashed | Returns <mxConstants.VERTEX_SELECTION_DASHED>. |
| createSizer | Creates a sizer handle for the specified cursor and index and returns the new mxRectangleShape that represents the handle. |
| isSizerVisible | Returns true if the sizer for the given index is visible. |
| createSizerShape | Creates the shape used for the sizer handle for the specified bounds an index. |
| createBounds | Helper method to create an mxRectangle around the given centerpoint with a width and height of 2*s or 6, if no s is given. |
| getHandleForEvent | Returns the index of the handle for the given event. |
| isCustomHandleEvent | Returns true if the given event allows custom handles to be changed. |
| mouseDown | Handles the event if a handle has been clicked. |
| isLivePreviewBorder | Called if livePreview is enabled to check if a border should be painted. |
| start | Starts the handling of the mouse gesture. |
| hideHandles | Shortcut to hideSizers. |
| hideSizers | Hides all sizers except. |
| checkTolerance | Checks if the coordinates for the given event are within the mxGraph.tolerance. |
| updateHint | Hook for subclassers do show details while the handler is active. |
| removeHint | Hooks for subclassers to hide details when the handler gets inactive. |
| roundAngle | Hook for rounding the angle. |
| roundLength | Hook for rounding the unscaled width or height. |
| mouseMove | Handles the event by updating the preview. |
| rotateVertex | Rotates the vertex. |
| rotateVertex | Rotates the vertex. |
| rotateVertex | Rotates the vertex. |
| updateLivePreview | Repaints the live preview. |
| mouseUp | Handles the event by applying the changes to the geometry. |
| rotateCell | Rotates the given cell to the given rotation. |
| rotateClick | Hook for subclassers to implement a single click on the rotation handle. |
| rotateCell | Rotates the given cell and its children by the given angle in degrees. |
| reset | Resets the state of this handler. |
| resizeCell | Uses the given vector to change the bounds of the given cell in the graph using mxGraph.resizeCell. |
| moveChildren | Moves the children of the given cell by the given vector. |
| union | Returns the union of the given bounds and location for the specified handle index. |
| redraw | Redraws the handles and the preview. |
| redrawHandles | Redraws the handles. |
| getRotationHandlePosition | Returns an mxPoint that defines the rotation handle position. |
| updateParentHighlight | Updates the highlight of the parent if parentHighlightEnabled is true. |
| drawPreview | Redraws the preview. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxEdgeHandler | Graph event handler that reconnects edges and modifies control points and the edge label location. |
| Functions | |
| mxEdgeHandler | Constructs an edge handler for the specified mxCellState. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| state | Reference to the mxCellState being modified. |
| marker | Holds the <mxTerminalMarker> which is used for highlighting terminals. |
| constraintHandler | Holds the mxConstraintHandler used for drawing and highlighting constraints. |
| error | Holds the current validation error while a connection is being changed. |
| shape | Holds the mxShape that represents the preview edge. |
| bends | Holds the mxShapes that represent the points. |
| labelShape | Holds the mxShape that represents the label position. |
| cloneEnabled | Specifies if cloning by control-drag is enabled. |
| addEnabled | Specifies if adding bends by shift-click is enabled. |
| removeEnabled | Specifies if removing bends by shift-click is enabled. |
| dblClickRemoveEnabled | Specifies if removing bends by double click is enabled. |
| mergeRemoveEnabled | Specifies if removing bends by dropping them on other bends is enabled. |
| straightRemoveEnabled | Specifies if removing bends by creating straight segments should be enabled. |
| virtualBendsEnabled | Specifies if virtual bends should be added in the center of each segments. |
| virtualBendOpacity | Opacity to be used for virtual bends (see virtualBendsEnabled). |
| parentHighlightEnabled | Specifies if the parent should be highlighted if a child cell is selected. |
| preferHtml | Specifies if bends should be added to the graph container. |
| allowHandleBoundsCheck | Specifies if the bounds of handles should be used for hit-detection in IE Default is true. |
| snapToTerminals | Specifies if waypoints should snap to the routing centers of terminals. |
| handleImage | Optional mxImage to be used as handles. |
| tolerance | Optional tolerance for hit-detection in getHandleForEvent. |
| outlineConnect | Specifies if connections to the outline of a highlighted target should be enabled. |
| manageLabelHandle | Specifies if the label handle should be moved if it intersects with another handle. |
| Functions | |
| init | Initializes the shapes required for this edge handler. |
| createCustomHandles | Returns an array of custom handles. |
| isVirtualBendsEnabled | Returns true if virtual bends should be added. |
| isAddPointEvent | Returns true if the given event is a trigger to add a new point. |
| isRemovePointEvent | Returns true if the given event is a trigger to remove a point. |
| getSelectionPoints | Returns the list of points that defines the selection stroke. |
| createSelectionShape | Creates the shape used to draw the selection border. |
| createSelectionShape | Creates the shape used to draw the selection border. |
| getSelectionColor | Returns mxConstants.EDGE_SELECTION_COLOR. |
| getSelectionStrokeWidth | Returns mxConstants.EDGE_SELECTION_STROKEWIDTH. |
| isSelectionDashed | Returns <mxConstants.EDGE_SELECTION_DASHED>. |
| isConnectableCell | Returns true if the given cell is connectable. |
| getCellAt | Creates and returns the mxCellMarker used in marker. |
| createMarker | Creates and returns the mxCellMarker used in marker. |
| validateConnection | Returns the error message or an empty string if the connection for the given source, target pair is not valid. |
| createBends | Creates and returns the bends used for modifying the edge. |
| createVirtualBends | Creates and returns the bends used for modifying the edge. |
| isHandleEnabled | Creates the shape used to display the given bend. |
| isHandleVisible | Returns true if the handle at the given index is visible. |
| createHandleShape | Creates the shape used to display the given bend. |
| createLabelHandleShape | Creates the shape used to display the the label handle. |
| initBend | Helper method to initialize the given bend. |
| getHandleForEvent | Returns the index of the handle for the given event. |
| isAddVirtualBendEvent | Returns true if the given event allows virtual bends to be added. |
| isCustomHandleEvent | Returns true if the given event allows custom handles to be changed. |
| mouseDown | Handles the event by checking if a special element of the handler was clicked, in which case the index parameter is non-null. |
| start | Starts the handling of the mouse gesture. |
| clonePreviewState | Returns a clone of the current preview state for the given point and terminal. |
| getSnapToTerminalTolerance | Returns the tolerance for the guides. |
| updateHint | Hook for subclassers do show details while the handler is active. |
| removeHint | Hooks for subclassers to hide details when the handler gets inactive. |
| roundLength | Hook for rounding the unscaled width or height. |
| isSnapToTerminalsEvent | Returns true if snapToTerminals is true and if alt is not pressed. |
| getPointForEvent | Returns the point for the given event. |
| getPreviewTerminalState | Updates the given preview state taking into account the state of the constraint handler. |
| getPreviewPoints | Updates the given preview state taking into account the state of the constraint handler. |
| isOutlineConnectEvent | Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed. |
| updatePreviewState | Updates the given preview state taking into account the state of the constraint handler. |
| mouseMove | Handles the event by updating the preview. |
| mouseUp | Handles the event to applying the previewed changes on the edge by using moveLabel, connect or changePoints. |
| reset | Resets the state of this handler. |
| setPreviewColor | Sets the color of the preview to the given value. |
| convertPoint | Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid. |
| moveLabel | Changes the coordinates for the label of the given edge. |
| connect | Changes the terminal or terminal point of the given edge in the graph model. |
| changeTerminalPoint | Changes the terminal point of the given edge. |
| changePoints | Changes the control points of the given edge in the graph model. |
| addPoint | Adds a control point for the given state and event. |
| addPointAt | Adds a control point at the given point. |
| removePoint | Removes the control point at the given index from the given state. |
| getHandleFillColor | Returns the fillcolor for the handle at the given index. |
| redraw | Redraws the preview, and the bends- and label control points. |
| redrawHandles | Redraws the handles. |
| hideHandles | Shortcut to <hideSizers>. |
| redrawInnerBends | Updates and redraws the inner bends. |
| checkLabelHandle | Checks if the label handle intersects the given bounds and moves it if it intersects. |
| drawPreview | Redraws the preview. |
| refresh | Refreshes the bends of this handler. |
| destroyBends | Destroys all elements in bends. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxElbowEdgeHandler | Graph event handler that reconnects edges and modifies control points and the edge label location. |
| Functions | |
| mxEdgeHandler | Constructs an edge handler for the specified mxCellState. |
| Variables | |
| doubleClickOrientationResource | Specifies the resource key for the tooltip to be displayed on the single control point for routed edges. |
| Functions | |
| createBends | Overrides mxEdgeHandler.createBends to create custom bends. |
| createVirtualBend | Creates a virtual bend that supports double clicking and calls mxGraph.flipEdge. |
| getCursorForBend | Returns the cursor to be used for the bend. |
| getTooltipForNode | Returns the tooltip for the given node. |
| convertPoint | Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid. |
| redrawInnerBends | Updates and redraws the inner bends. |
| getCurrentPoints | Returns the current absolute points. |
| getPreviewPoints | Updates the given preview state taking into account the state of the constraint handler. |
| updatePreviewState | Overridden to perform optimization of the edge style result. |
| getTooltipForNode | Returns no tooltips. |
| createBends | Adds custom bends for the center of each segment. |
| createBends | Adds custom bends for the center of each segment. |
| redraw | Overridden to invoke <refresh> before the redraw. |
| redrawInnerBends | Updates the position of the custom bends. |
| mxKeyHandler | Event handler that listens to keystroke events. |
| Functions | |
| mxKeyHandler | Constructs an event handler that executes functions bound to specific keystrokes. |
| Variables | |
| graph | Reference to the mxGraph associated with this handler. |
| target | Reference to the target DOM, that is, the DOM node where the key event listeners are installed. |
| normalKeys | Maps from keycodes to functions for non-pressed control keys. |
| shiftKeys | Maps from keycodes to functions for pressed shift keys. |
| controlKeys | Maps from keycodes to functions for pressed control keys. |
| controlShiftKeys | Maps from keycodes to functions for pressed control and shift keys. |
| enabled | Specifies if events are handled. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling by updating enabled. |
| bindKey | Binds the specified keycode to the given function. |
| bindShiftKey | Binds the specified keycode to the given function. |
| bindControlKey | Binds the specified keycode to the given function. |
| bindControlShiftKey | Binds the specified keycode to the given function. |
| isControlDown | Returns true if the control key is pressed. |
| getFunction | Returns the function associated with the given key event or null if no function is associated with the given event. |
| isGraphEvent | Returns true if the event should be processed by this handler, that is, if the event source is either the target, one of its direct children, a descendant of the <mxGraph.container>, or the mxGraph.cellEditor of the graph. |
| keyDown | Handles the event by invoking the function bound to the respective keystroke if isEnabledForEvent returns true for the given event and if isEventIgnored returns false, except for escape for which isEventIgnored is not invoked. |
| isEnabledForEvent | Returns true if the given event should be handled. |
| isEventIgnored | Returns true if the given keystroke should be ignored. |
| escape | Hook to process ESCAPE keystrokes. |
| destroy | Destroys the handler and all its references into the DOM. |
| mxTooltipHandler | Graph event handler that displays tooltips. |
| Functions | |
| mxTooltipHandler | Constructs an event handler that displays tooltips with the specified delay (in milliseconds). |
| Variables | |
| zIndex | Specifies the zIndex for the tooltip and its shadow. |
| graph | Reference to the enclosing mxGraph. |
| delay | Delay to show the tooltip in milliseconds. |
| ignoreTouchEvents | Specifies if touch and pen events should be ignored. |
| hideOnHover | Specifies if the tooltip should be hidden if the mouse is moved over the current cell. |
| destroyed | True if this handler was destroyed using destroy. |
| enabled | Specifies if events are handled. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isHideOnHover | Returns hideOnHover. |
| setHideOnHover | Sets hideOnHover. |
| init | Initializes the DOM nodes required for this tooltip handler. |
| getStateForEvent | Returns the mxCellState to be used for showing a tooltip for this event. |
| mouseDown | Handles the event by initiating a rubberband selection. |
| mouseMove | Handles the event by updating the rubberband selection. |
| mouseUp | Handles the event by resetting the tooltip timer or hiding the existing tooltip. |
| resetTimer | Resets the timer. |
| reset | Resets and/or restarts the timer to trigger the display of the tooltip. |
| hide | Hides the tooltip and resets the timer. |
| hideTooltip | Hides the tooltip. |
| show | Shows the tooltip for the specified cell and optional index at the specified location (with a vertical offset of 10 pixels). |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxCellTracker | Event handler that highlights cells. |
| Functions | |
| mxCellTracker | Constructs an event handler that highlights cells. |
| mouseDown | Ignores the event. |
| mouseMove | Handles the event by highlighting the cell under the mousepointer if it is over the hotspot region of the cell. |
| mouseUp | Handles the event by reseting the highlight. |
| destroy | Destroys the object and all its resources and DOM nodes. |
| mxCellHighlight | A helper class to highlight cells. |
| Functions | |
| mxCellHighlight | Constructs a cell highlight. |
| Variables | |
| keepOnTop | Specifies if the highlights should appear on top of everything else in the overlay pane. |
| graph | Reference to the enclosing mxGraph. |
| state | Reference to the mxCellState. |
| spacing | Specifies the spacing between the highlight for vertices and the vertex. |
| resetHandler | Holds the handler that automatically invokes reset if the highlight should be hidden. |
| Functions | |
| setHighlightColor | Sets the color of the rectangle used to highlight drop targets. |
| drawHighlight | Creates and returns the highlight shape for the given state. |
| createShape | Creates and returns the highlight shape for the given state. |
| repaint | Updates the highlight after a change of the model or view. |
| repaint | Updates the highlight after a change of the model or view. |
| hide | Resets the state of the cell marker. |
| mark | Marks the <markedState> and fires a mark event. |
| isHighlightAt | Returns true if this highlight is at the given position. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
| mxDefaultKeyHandler | Binds keycodes to actionnames in an editor. |
| Functions | |
| mxDefaultKeyHandler | Constructs a new default key handler for the mxEditor.graph in the given mxEditor. |
| Variables | |
| editor | Reference to the enclosing mxEditor. |
| handler | Holds the mxKeyHandler for key event handling. |
| Functions | |
| bindAction | Binds the specified keycode to the given action in editor. |
| destroy | Destroys the handler associated with this object. |
| mxDefaultPopupMenu | Creates popupmenus for mouse events. |
| Functions | |
| mxDefaultPopupMenu | Constructs a new popupmenu-factory based on given configuration. |
| Variables | |
| imageBasePath | Base path for all icon attributes in the config. |
| config | XML node used as the description of new menu items. |
| Functions | |
| createMenu | This function is called from mxEditor to add items to the given menu based on config. |
| addItems | Recursively adds the given items and all of its children into the given menu. |
| addAction | Helper method to bind an action to a new menu item. |
| createConditions | Evaluates the default conditions for the given context. |
| mxDefaultToolbar | Toolbar for the editor. |
| Functions | |
| mxDefaultToolbar | Constructs a new toolbar for the given container and editor. |
| Variables | |
| editor | Reference to the enclosing mxEditor. |
| toolbar | Holds the internal mxToolbar. |
| resetHandler | Reference to the function used to reset the toolbar. |
| spacing | Defines the spacing between existing and new vertices in gridSize units when a new vertex is dropped on an existing cell. |
| connectOnDrop | Specifies if elements should be connected if new cells are dropped onto connectable elements. |
| init | Constructs the toolbar for the given container and installs a listener that updates the mxEditor.insertFunction on editor if an item is selected in the toolbar. |
| Functions | |
| addItem | Adds a new item that executes the given action in editor. |
| addSeparator | Adds a vertical separator using the optional icon. |
| addCombo | Helper method to invoke mxToolbar.addCombo on toolbar and return the resulting DOM node. |
| addActionCombo | Helper method to invoke <mxToolbar.addActionCombo> on toolbar using the given title and return the resulting DOM node. |
| addActionOption | Binds the given action to a option with the specified label in the given combo. |
| addOption | Helper method to invoke mxToolbar.addOption on toolbar and return the resulting DOM node that represents the option. |
| addMode | Creates an item for selecting the given mode in the editor’s graph. |
| addPrototype | Creates an item for inserting a clone of the specified prototype cell into the editor’s graph. |
| drop | Handles a drop from a toolbar item to the graph. |
| insert | Handles a drop by inserting the given vertex into the given parent cell or the default parent if no parent is specified. |
| connect | Handles a drop by connecting the given vertex to the given source cell. |
| installDropHandler | Makes the given img draggable using the given function for handling a drop event. |
| destroy | Destroys the toolbar associated with this object and removes all installed listeners. |
| mxEditor | Extends mxEventSource to implement a application wrapper for a graph that adds actions, I/O using mxCodec, auto-layout using mxLayoutManager, command history using undoManager, and standard dialogs and widgets, eg. |
| onInit | Called from within the constructor. |
| mxgraph=seen | Set when the editor is started. |
| mxEvent.OPEN | Fires after a file was opened in open. |
| mxEvent.SAVE | Fires after the current file was saved in save. |
| mxEvent.POST | Fires if a successful response was received in postDiagram. |
| mxEvent.ROOT | Fires when the current root has changed, or when the title of the current root has changed. |
| mxEvent. | Fires before a vertex is added in addVertex. |
| mxEvent. | Fires between begin- and endUpdate in addVertex. |
| mxEvent. | Fires after a vertex was inserted and selected in addVertex. |
| mxEvent. | Fires when the escape key is pressed. |
| mxEditor | Constructs a new editor. |
| Controls and Handlers | |
| askZoomResource | Specifies the resource key for the zoom dialog. |
| lastSavedResource | Specifies the resource key for the last saved info. |
| currentFileResource | Specifies the resource key for the current file info. |
| propertiesResource | Specifies the resource key for the properties window title. |
| tasksResource | Specifies the resource key for the tasks window title. |
| helpResource | Specifies the resource key for the help window title. |
| outlineResource | Specifies the resource key for the outline window title. |
| outline | Reference to the mxWindow that contains the outline. |
| graph | Holds a mxGraph for displaying the diagram. |
| graphRenderHint | Holds the render hint used for creating the graph in setGraphContainer. |
| toolbar | Holds a mxDefaultToolbar for displaying the toolbar. |
| status | DOM container that holds the statusbar. |
| popupHandler | Holds a mxDefaultPopupMenu for displaying popupmenus. |
| undoManager | Holds an mxUndoManager for the command history. |
| keyHandler | Holds a mxDefaultKeyHandler for handling keyboard events. |
| Actions and Options | |
| actions | Maps from actionnames to actions, which are functions taking the editor and the cell as arguments. |
| dblClickAction | Specifies the name of the action to be executed when a cell is double clicked. |
| swimlaneRequired | Specifies if new cells must be inserted into an existing swimlane. |
| disableContextMenu | Specifies if the context menu should be disabled in the graph container. |
| Templates | |
| insertFunction | Specifies the function to be used for inserting new cells into the graph. |
| forcedInserting | Specifies if a new cell should be inserted on a single click even using insertFunction if there is a cell under the mousepointer, otherwise the cell under the mousepointer is selected. |
| templates | Maps from names to protoype cells to be used in the toolbar for inserting new cells into the diagram. |
| defaultEdge | Prototype edge cell that is used for creating new edges. |
| defaultEdgeStyle | Specifies the edge style to be returned in getEdgeStyle. |
| defaultGroup | Prototype group cell that is used for creating new groups. |
| groupBorderSize | Default size for the border of new groups. |
| Backend Integration | |
| filename | Contains the URL of the last opened file as a string. |
| lineFeed | Character to be used for encoding linefeeds in save. |
| postParameterName | Specifies if the name of the post parameter that contains the diagram data in a post request to the server. |
| escapePostData | Specifies if the data in the post request for saving a diagram should be converted using encodeURIComponent. |
| urlPost | Specifies the URL to be used for posting the diagram to a backend in save. |
| urlImage | Specifies the URL to be used for creating a bitmap of the graph in the image action. |
| Autolayout | |
| horizontalFlow | Specifies the direction of the flow in the diagram. |
| layoutDiagram | Specifies if the top-level elements in the diagram should be layed out using a vertical or horizontal stack depending on the setting of horizontalFlow. |
| swimlaneSpacing | Specifies the spacing between swimlanes if automatic layout is turned on in layoutDiagram. |
| maintainSwimlanes | Specifies if the swimlanes should be kept at the same width or height depending on the setting of horizontalFlow. |
| layoutSwimlanes | Specifies if the children of swimlanes should be layed out, either vertically or horizontally depending on horizontalFlow. |
| Attribute Cycling | |
| cycleAttributeValues | Specifies the attribute values to be cycled when inserting new swimlanes. |
| cycleAttributeIndex | Index of the last consumed attribute index. |
| cycleAttributeName | Name of the attribute to be assigned a cycleAttributeValues when inserting new swimlanes. |
| Windows | |
| tasks | Holds the mxWindow created in showTasks. |
| tasksWindowImage | Icon for the tasks window. |
| tasksTop | Specifies the top coordinate of the tasks window in pixels. |
| help | Holds the mxWindow created in showHelp. |
| helpWindowImage | Icon for the help window. |
| urlHelp | Specifies the URL to be used for the contents of the Online Help window. |
| helpWidth | Specifies the width of the help window in pixels. |
| helpHeight | Specifies the height of the help window in pixels. |
| propertiesWidth | Specifies the width of the properties window in pixels. |
| propertiesHeight | Specifies the height of the properties window in pixels. |
| movePropertiesDialog | Specifies if the properties dialog should be automatically moved near the cell it is displayed for, otherwise the dialog is not moved. |
| validating | Specifies if mxGraph.validateGraph should automatically be invoked after each change. |
| modified | True if the graph has been modified since it was last saved. |
| isModified | Returns modified. |
| setModified | Sets modified to the specified boolean value. |
| addActions | Adds the built-in actions to the editor instance. |
| configure | Configures the editor using the specified node. |
| resetFirstTime | Resets the cookie that is used to remember if the editor has already been used. |
| resetHistory | Resets the command history, modified state and counters. |
| addAction | Binds the specified actionname to the specified function. |
| execute | Executes the function with the given name in actions passing the editor instance and given cell as the first and second argument. |
| addTemplate | Adds the specified template under the given name in templates. |
| getTemplate | Returns the template for the given name. |
| createGraph | Creates the graph for the editor. |
| createSwimlaneManager | Sets the graph’s container using mxGraph.init. |
| createLayoutManager | Creates a layout manager for the swimlane and diagram layouts, that is, the locally defined inter- and intraswimlane layouts. |
| setGraphContainer | Sets the graph’s container using mxGraph.init. |
| installDblClickHandler | Overrides mxGraph.dblClick to invoke dblClickAction on a cell and reset the selection tool in the toolbar. |
| installUndoHandler | Adds the undoManager to the graph model and the view. |
| installDrillHandler | Installs listeners for dispatching the <root> event. |
| installChangeHandler | Installs the listeners required to automatically validate the graph. |
| installInsertHandler | Installs the handler for invoking insertFunction if one is defined. |
| createDiagramLayout | Creates the layout instance used to layout the swimlanes in the diagram. |
| createSwimlaneLayout | Creates the layout instance used to layout the children of each swimlane. |
| createToolbar | Creates the toolbar with no container. |
| setToolbarContainer | Initializes the toolbar for the given container. |
| setStatusContainer | Creates the status using the specified container. |
| setStatus | Display the specified message in the status bar. |
| setTitleContainer | Creates a listener to update the inner HTML of the specified DOM node with the value of getTitle. |
| treeLayout | Executes a vertical or horizontal compact tree layout using the specified cell as an argument. |
| getTitle | Returns the string value for the current root of the diagram. |
| getRootTitle | Returns the string value of the root cell in mxGraph.model. |
| undo | Undo the last change in graph. |
| redo | Redo the last change in graph. |
| groupCells | Invokes createGroup to create a new group cell and the invokes mxGraph.groupCells, using the grid size of the graph as the spacing in the group’s content area. |
| createGroup | Creates and returns a clone of defaultGroup to be used as a new group cell in <group>. |
| open | Opens the specified file synchronously and parses it using readGraphModel. |
| readGraphModel | Reads the specified XML node into the existing graph model and resets the command history and modified state. |
| save | Posts the string returned by writeGraphModel to the given URL or the URL returned by getUrlPost. |
| postDiagram | Hook for subclassers to override the posting of a diagram represented by the given node to the given URL. |
| writeGraphModel | Hook to create the string representation of the diagram. |
| getUrlPost | Returns the URL to post the diagram to. |
| getUrlImage | Returns the URL to create the image with. |
| swapStyles | Swaps the styles for the given names in the graph’s stylesheet and refreshes the graph. |
| showProperties | Creates and shows the properties dialog for the given cell. |
| isPropertiesVisible | Returns true if the properties dialog is currently visible. |
| createProperties | Creates and returns the DOM node that represents the contents of the properties dialog for the given cell. |
| hideProperties | Hides the properties dialog. |
| showTasks | Shows the tasks window. |
| refreshTasks | Updates the contents of the tasks window using createTasks. |
| createTasks | Updates the contents of the given DOM node to display the tasks associated with the current editor state. |
| showHelp | Shows the help window. |
| showOutline | Shows the outline window. |
| setMode | Puts the graph into the specified mode. |
| createPopupMenu | Uses popupHandler to create the menu in the graph’s panning handler. |
| createEdge | Uses defaultEdge as the prototype for creating new edges in the connection handler of the graph. |
| getEdgeStyle | Returns a string identifying the style of new edges. |
| consumeCycleAttribute | Returns the next attribute in cycleAttributeValues or null, if not attribute should be used in the specified cell. |
| cycleAttribute | Uses the returned value from consumeCycleAttribute as the value for the cycleAttributeName key in the given cell’s style. |
| addVertex | Adds the given vertex as a child of parent at the specified x and y coordinate and fires an addVertex event. |
| destroy | Removes the editor and all its associated resources. |
| mxCodecRegistry | Singleton class that acts as a global registry for codecs. |
| Variables | |
| codecs | Maps from constructor names to codecs. |
| aliases | Maps from classnames to codecnames. |
| Functions | |
| register | Registers a new codec and associates the name of the template constructor in the codec with the codec object. |
| addAlias | Adds an alias for mapping a classname to a codecname. |
| getCodec | Returns a codec that handles objects that are constructed using the given constructor. |
| mxCodec | XML codec for JavaScript object graphs. |
| Functions | |
| mxCodec | Constructs an XML encoder/decoder for the specified owner document. |
| Variables | |
| document | The owner document of the codec. |
| objects | Maps from IDs to objects. |
| elements | Lookup table for resolving IDs to elements. |
| encodeDefaults | Specifies if default values should be encoded. |
| Functions | |
| putObject | Assoiates the given object with the given ID and returns the given object. |
| getObject | Returns the decoded object for the element with the specified ID in document. |
| lookup | Hook for subclassers to implement a custom lookup mechanism for cell IDs. |
| getElementById | Returns the element with the given ID from document. |
| updateElements | Returns the element with the given ID from document. |
| addElement | Adds the given element to elements if it has an ID. |
| getId | Returns the ID of the specified object. |
| reference | Hook for subclassers to implement a custom method for retrieving IDs from objects. |
| encode | Encodes the specified object and returns the resulting XML node. |
| decode | Decodes the given XML node. |
| encodeCell | Encoding of cell hierarchies is built-into the core, but is a higher-level function that needs to be explicitely used by the respective object encoders (eg. |
| isCellCodec | Returns true if the given codec is a cell codec. |
| decodeCell | Decodes cells that have been encoded using inversion, ie. |
| insertIntoGraph | Inserts the given cell into its parent and terminal cells. |
| setAttribute | Sets the attribute on the specified node to value. |
| mxObjectCodec | Generic codec for JavaScript objects that implements a mapping between JavaScript objects and XML nodes that maps each field or element to an attribute or child node, and vice versa. |
| Functions | |
| mxObjectCodec | Constructs a new codec for the specified template object. |
| Variables | |
| allowEval | Static global switch that specifies if expressions in arrays are allowed. |
| template | Holds the template object associated with this codec. |
| exclude | Array containing the variable names that should be ignored by the codec. |
| idrefs | Array containing the variable names that should be turned into or converted from references. |
| mapping | Maps from from fieldnames to XML attribute names. |
| reverse | Maps from from XML attribute names to fieldnames. |
| Functions | |
| getName | Returns the name used for the nodenames and lookup of the codec when classes are encoded and nodes are decoded. |
| cloneTemplate | Returns a new instance of the template for this codec. |
| getFieldName | Returns the fieldname for the given attributename. |
| getAttributeName | Returns the attributename for the given fieldname. |
| isExcluded | Returns true if the given attribute is to be ignored by the codec. |
| isReference | Returns true if the given fieldname is to be treated as a textual reference (ID). |
| encode | Encodes the specified object and returns a node representing then given object. |
| encodeObject | Encodes the value of each member in then given obj into the given node using encodeValue. |
| encodeValue | Converts the given value according to the mappings and id-refs in this codec and uses writeAttribute to write the attribute into the given node. |
| writeAttribute | Writes the given value into node using writePrimitiveAttribute or writeComplexAttribute depending on the type of the value. |
| writePrimitiveAttribute | Writes the given value as an attribute of the given node. |
| writeComplexAttribute | Writes the given value as a child node of the given node. |
| convertAttributeToXml | Converts true to “1” and false to “0” is isBooleanAttribute returns true. |
| isBooleanAttribute | Returns true if the given object attribute is a boolean value. |
| convertAttributeFromXml | Converts booleans and numeric values to the respective types. |
| isNumericAttribute | Returns true if the given XML attribute is or should be a numeric value. |
| beforeEncode | Hook for subclassers to pre-process the object before encoding. |
| afterEncode | Hook for subclassers to post-process the node for the given object after encoding and return the post-processed node. |
| decode | Parses the given node into the object or returns a new object representing the given node. |
| decodeNode | Calls decodeAttributes and decodeChildren for the given node. |
| decodeAttributes | Decodes all attributes of the given node using decodeAttribute. |
| isIgnoredAttribute | Returns true if the given attribute should be ignored. |
| decodeAttribute | Reads the given attribute into the specified object. |
| decodeChildren | Decodes all children of the given node using decodeChild. |
| decodeChild | Reads the specified child into the given object. |
| getFieldTemplate | Returns the template instance for the given field. |
| addObjectValue | Sets the decoded child node as a value of the given object. |
| processInclude | Returns true if the given node is an include directive and executes the include by decoding the XML document. |
| beforeDecode | Hook for subclassers to pre-process the node for the specified object and return the node to be used for further processing by decode. |
| afterDecode | Hook for subclassers to post-process the object after decoding. |
| mxCellCodec | Codec for mxCells. |
| Functions | |
| isCellCodec | Returns true since this is a cell codec. |
| isExcluded | Excludes user objects that are XML nodes. |
| afterEncode | Encodes an mxCell and wraps the XML up inside the XML of the user object (inversion). |
| beforeDecode | Decodes an mxCell and uses the enclosing XML node as the user object for the cell (inversion). |
| mxModelCodec | Codec for mxGraphModels. |
| Functions | |
| encodeObject | Encodes the given mxGraphModel by writing a (flat) XML sequence of cell nodes as produced by the mxCellCodec. |
| decodeChild | Overrides decode child to handle special child nodes. |
| decodeRoot | Reads the cells into the graph model. |
| mxRootChangeCodec | Codec for mxRootChanges. |
| Functions | |
| onEncode | Encodes the child recursively. |
| beforeDecode | Decodes the optional children as cells using the respective decoder. |
| afterDecode | Restores the state by assigning the previous value. |
| mxChildChangeCodec | Codec for mxChildChanges. |
| Functions | |
| isReference | Returns true for the child attribute if the child cell had a previous parent or if we’re reading the child as an attribute rather than a child node, in which case it’s always a reference. |
| isExcluded | Excludes references to parent or previous if not in the model. |
| afterEncode | Encodes the child recusively and adds the result to the given node. |
| beforeDecode | Decodes the any child nodes as using the respective codec from the registry. |
| afterDecode | Restores object state in the child change. |
| mxTerminalChangeCodec | Codec for mxTerminalChanges. |
| Functions | |
| afterDecode | Restores the state by assigning the previous value. |
| mxGenericChangeCodec | Codec for mxValueChanges, mxStyleChanges, mxGeometryChanges, mxCollapseChanges and mxVisibleChanges. |
| Functions | |
| mxGenericChangeCodec | Factory function that creates a mxObjectCodec for the specified change and fieldname. |
| afterDecode | Restores the state by assigning the previous value. |
| mxGraphCodec | Codec for mxGraphs. |
| mxGraphViewCodec | Custom encoder for mxGraphViews. |
| Functions | |
| encode | Encodes the given mxGraphView using encodeCell starting at the model’s root. |
| encodeCell | Recursively encodes the specifed cell. |
| mxStylesheetCodec | Codec for mxStylesheets. |
| Functions | |
| encode | Encodes a stylesheet. |
| getStringValue | Returns the string for encoding the given value. |
| decode | Reads a sequence of the following child nodes and attributes: |
| Variables | |
| allowEval | Static global switch that specifies if the use of eval is allowed for evaluating text content. |
| mxDefaultKeyHandlerCodec | Custom codec for configuring mxDefaultKeyHandlers. |
| Functions | |
| encode | Returns null. |
| decode | Reads a sequence of the following child nodes and attributes: |
| mxDefaultToolbarCodec | Custom codec for configuring mxDefaultToolbars. |
| Functions | |
| encode | Returns null. |
| decode | Reads a sequence of the following child nodes and attributes: |
| Variables | |
| allowEval | Static global switch that specifies if the use of eval is allowed for evaluating text content. |
| mxDefaultPopupMenuCodec | Custom codec for configuring mxDefaultPopupMenus. |
| Functions | |
| encode | Returns null. |
| decode | Uses the given node as the config for mxDefaultPopupMenu. |
| mxEditorCodec | Codec for mxEditors. |
| Functions | |
| beforeDecode | Decodes the ui-part of the configuration node by reading a sequence of the following child nodes and attributes and passes the control to the default decoding mechanism: |
| decodeChild | Overrides decode child to handle special child nodes. |
| decodeTemplates | Decodes the cells from the given node as templates. |
| decodeTemplates | Decodes the cells from the given node as templates. |
IS_IE: navigator.userAgent.indexOf( 'MSIE' ) >
True if the current browser is Internet Explorer 10 or below. Use mxClient.IS_IE11 to detect IE 11.
isBrowserSupported: function()
Returns true if the current browser is supported, that is, if mxClient.IS_VML or mxClient.IS_SVG is true.
if (!mxClient.isBrowserSupported())
{
mxUtils.error('Browser is not supported!', 200, false);
}
link: function( rel, href, doc, id )
Adds a link node to the head of the document. Use this to add a stylesheet to the page as follows:
mxClient.link('stylesheet', filename);where filename is the (relative) URL of the stylesheet. The charset is hardcoded to ISO-8859-1 and the type is text/css.
| rel | String that represents the rel attribute of the link node. |
| href | String that represents the href attribute of the link node. |
| doc | Optional parent document of the link node. |
| id | unique id for the link element to check if it already exists |
loadResources: function( fn, lan )
Helper method to load the default bundles if mxLoadResources is false.
| fn | Function to call after all resources have been loaded. |
| lan | Optional string to pass to mxResources.add. |
include: function( src )
Dynamically adds a script node to the document header.
In production environments, the includes are resolved in the mxClient.js file to reduce the number of requests required for client startup. This function should only be used in development environments, but not in production systems.
Optional global config variable to toggle loading of the two resource files in mxGraph and mxEditor. Default is true. NOTE: This is a global variable, not a variable of mxClient. If this is false, you can use mxClient.loadResources with its callback to load the default bundles asynchronously.
<script type="text/javascript">
var mxLoadResources = false;
</script>
<script type="text/javascript" src="/path/to/core/directory/js/mxClient.js"></script>Optional global config variable to force loading the JavaScript files in development mode. Default is undefined. NOTE: This is a global variable, not a variable of mxClient.
<script type="text/javascript">
var mxLoadResources = true;
</script>
<script type="text/javascript" src="/path/to/core/directory/js/mxClient.js"></script>Optional global config variable to specify the extension of resource files. Default is true. NOTE: This is a global variable, not a variable of mxClient.
<script type="text/javascript">
var mxResourceExtension = '.txt';
</script>
<script type="text/javascript" src="/path/to/core/directory/js/mxClient.js"></script>Optional global config variable to toggle loading of the CSS files when the library is initialized. Default is true. NOTE: This is a global variable, not a variable of mxClient.
<script type="text/javascript">
var mxLoadStylesheets = false;
</script>
<script type="text/javascript" src="/path/to/core/directory/js/mxClient.js"></script>Basepath for all URLs in the core without trailing slash. Default is ‘.’. Set mxBasePath prior to loading the mxClient library as follows to override this setting:
<script type="text/javascript">
mxBasePath = '/path/to/core/directory';
</script>
<script type="text/javascript" src="/path/to/core/directory/js/mxClient.js"></script>When using a relative path, the path is relative to the URL of the page that contains the assignment. Trailing slashes are automatically removed.
Basepath for all images URLs in the core without trailing slash. Default is mxClient.basePath + ‘/images’. Set mxImageBasePath prior to loading the mxClient library as follows to override this setting:
<script type="text/javascript">
mxImageBasePath = '/path/to/image/directory';
</script>
<script type="text/javascript" src="/path/to/core/directory/js/mxClient.js"></script>When using a relative path, the path is relative to the URL of the page that contains the assignment. Trailing slashes are automatically removed.
Defines the language of the client, eg. en for english, de for german etc. The special value ‘none’ will disable all built-in internationalization and resource loading. See mxResources.getSpecialBundle for handling identifiers with and without a dash.
Set mxLanguage prior to loading the mxClient library as follows to override this setting:
<script type="text/javascript">
mxLanguage = 'en';
</script>
<script type="text/javascript" src="js/mxClient.js"></script>If internationalization is disabled, then the following variables should be overridden to reflect the current language of the system. These variables are cleared when i18n is disabled. mxEditor.askZoomResource, mxEditor.lastSavedResource, mxEditor.currentFileResource, mxEditor.propertiesResource, mxEditor.tasksResource, mxEditor.helpResource, mxEditor.outlineResource, mxElbowEdgeHandler.doubleClickOrientationResource, mxUtils.errorResource, mxUtils.closeResource, mxGraphSelectionModel.doneResource, mxGraphSelectionModel.updatingSelectionResource, mxGraphView.doneResource, mxGraphView.updatingDocumentResource, <mxCellRenderer.collapseExpandResource>, mxGraph.containsValidationErrorsResource and mxGraph.alreadyConnectedResource.
Defines the default language which is used in the common resource files. Any resources for this language will only load the common resource file, but not the language-specific resource file. Default is ‘en’.
Set mxDefaultLanguage prior to loading the mxClient library as follows to override this setting:
<script type="text/javascript">
mxDefaultLanguage = 'de';
</script>
<script type="text/javascript" src="js/mxClient.js"></script>Defines the optional array of all supported language extensions. The default language does not have to be part of this list. See mxResources.isLanguageSupported.
<script type="text/javascript">
mxLanguages = ['de', 'it', 'fr'];
</script>
<script type="text/javascript" src="js/mxClient.js"></script>This is used to avoid unnecessary requests to language files, ie. if a 404 will be returned.
A singleton class that implements a simple console.
| Variables | |
| consoleName | Specifies the name of the console window. |
| TRACE | Specified if the output for enter and leave should be visible in the console. |
| DEBUG | Specifies if the output for debug should be visible in the console. |
| WARN | Specifies if the output for warn should be visible in the console. |
| buffer | Buffer for pre-initialized content. |
| Functions | |
| init | Initializes the DOM node for the console. |
| info | Writes the current navigator information to the console. |
| addButton | Adds a button to the console using the given label and function. |
| isVisible | Returns true if the console is visible. |
| show | Shows the console. |
| setVisible | Shows or hides the console. |
| enter | Writes the specified string to the console if TRACE is true and returns the current time in milliseconds. |
| leave | Writes the specified string to the console if TRACE is true and computes the difference between the current time and t0 in milliseconds. |
| debug | Adds all arguments to the console if DEBUG is enabled. |
| warn | Adds all arguments to the console if WARN is enabled. |
| write | Adds the specified strings to the console. |
| writeln | Adds the specified strings to the console, appending a linefeed at the end of each string. |
Specifies if the output for debug should be visible in the console. Default is true.
Specifies if the output for warn should be visible in the console. Default is true.
init: function()
Initializes the DOM node for the console. This requires document.body to point to a non-null value. This is called from within setVisible if the log has not yet been initialized.
enter: function( string )
Writes the specified string to the console if TRACE is true and returns the current time in milliseconds.
mxLog.show();
var t0 = mxLog.enter('Hello');
// Do something
mxLog.leave('World!', t0);
debug: function()
Adds all arguments to the console if DEBUG is enabled.
mxLog.show();
mxLog.debug('Hello, World!');
warn: function()
Adds all arguments to the console if WARN is enabled.
mxLog.show();
mxLog.warn('Hello, World!');Identity for JavaScript objects and functions. This is implemented using a simple incrementing counter which is stored in each object under FIELD_NAME.
The identity for an object does not change during its lifecycle.
A wrapper class for an associative array with object keys. Note: This implementation uses <mxObjectIdentitiy> to turn object keys into strings.
| Functions | |
| mxEventSource | Constructs a new dictionary which allows object to be used as keys. |
| map | Stores the (key, value) pairs in this dictionary. |
| clear | Clears the dictionary. |
| get | Returns the value for the given key. |
| put | Stores the value under the given key and returns the previous value for that key. |
| remove | Removes the value for the given key and returns the value that has been removed. |
| getKeys | Returns all keys as an array. |
| getValues | Returns all values as an array. |
| visit | Visits all entries in the dictionary using the given function with the following signature: function(key, value) where key is a string and value is an object. |
Implements internationalization. You can provide any number of resource files on the server using the following format for the filename: name[-en].properties. The en stands for any lowercase 2-character language shortcut (eg. de for german, fr for french).
If the optional language extension is omitted, then the file is used as a default resource which is loaded in all cases. If a properties file for a specific language exists, then it is used to override the settings in the default resource. All entries in the file are of the form key=value. The values may then be accessed in code via get. Lines without equal signs in the properties files are ignored.
Resource files may either be added programmatically using add or via a resource tag in the UI section of the editor configuration file, eg:
<mxEditor>
<ui>
<resource basename="examples/resources/mxWorkflow"/>The above element will load examples/resources/mxWorkflow.properties as well as the language specific file for the current language, if it exists.
Values may contain placeholders of the form {1}...{n} where each placeholder is replaced with the value of the corresponding array element in the params argument passed to mxResources.get. The placeholder {1} maps to the first element in the array (at index 0).
See mxClient.language for more information on specifying the default language or disabling all loading of resources.
Lines that start with a # sign will be ignored.
Special characters
To use unicode characters, use the standard notation (eg. \u8fd1) or %u as a prefix (eg. %u20AC will display a Euro sign). For normal hex encoded strings, use % as a prefix, eg. %F6 will display a “o umlaut” (ö).
See resourcesEncoded to disable this. If you disable this, make sure that your files are UTF-8 encoded.
Asynchronous loading
By default, the core adds two resource files synchronously at load time. To load these files asynchronously, set <mxLoadResources> to false before loading mxClient.js and use mxResources.loadResources instead.
| Variables | |
| resources | Object that maps from keys to values. |
| extension | Specifies the extension used for language files. |
| resourcesEncoded | Specifies whether or not values in resource files are encoded with \u or percentage. |
| loadDefaultBundle | Specifies if the default file for a given basename should be loaded. |
| loadDefaultBundle | Specifies if the specific language file file for a given basename should be loaded. |
| Functions | |
| isLanguageSupported | Hook for subclassers to disable support for a given language. |
| getDefaultBundle | Hook for subclassers to return the URL for the special bundle. |
| getSpecialBundle | Hook for subclassers to return the URL for the special bundle. |
| add | Adds the default and current language properties file for the specified basename. |
| parse | Parses the key, value pairs in the specified text and stores them as local resources. |
| get | Returns the value for the specified resource key. |
| replacePlaceholders | Replaces the given placeholders with the given parameters. |
| loadResources | Loads all required resources asynchronously. |
isLanguageSupported: function( lan )
Hook for subclassers to disable support for a given language. This implementation returns true if lan is in mxClient.languages.
| lan | The current language. |
getDefaultBundle: function( basename, lan )
Hook for subclassers to return the URL for the special bundle. This implementation returns basename + extension or null if loadDefaultBundle is false.
| basename | The basename for which the file should be loaded. |
| lan | The current language. |
getSpecialBundle: function( basename, lan )
Hook for subclassers to return the URL for the special bundle. This implementation returns basename + ‘_’ + lan + extension or null if <loadSpecialBundle> is false or lan equals mxClient.defaultLanguage.
If <mxResources.languages> is not null and mxClient.language contains a dash, then this method checks if isLanguageSupported returns true for the full language (including the dash). If that returns false the first part of the language (up to the dash) will be tried as an extension.
If <mxResources.language> is null then the first part of the language is used to maintain backwards compatibility.
| basename | The basename for which the file should be loaded. |
| lan | The language for which the file should be loaded. |
add: function( basename, lan, callback )
Adds the default and current language properties file for the specified basename. Existing keys are overridden as new files are added. If no callback is used then the request is synchronous.
At application startup, additional resources may be added using the following code:
mxResources.add('resources/editor');| basename | The basename for which the file should be loaded. |
| lan | The language for which the file should be loaded. |
| callback | Optional callback for asynchronous loading. |
get: function( key, params, defaultValue )
Returns the value for the specified resource key.
To read the value for ‘welomeMessage’, use the following:
var result = mxResources.get('welcomeMessage') || '';This would require an entry of the following form in one of the English language resource files:
welcomeMessage=Welcome to mxGraph!
The part behind the || is the string value to be used if the given resource is not available.
| key | String that represents the key of the resource to be returned. |
| params | Array of the values for the placeholders of the form {1}...{n} to be replaced with in the resulting string. |
| defaultValue | Optional string that specifies the default return value. |
mxPoint.prototype.clone = function()
Returns a clone of this mxPoint.
Extends mxPoint to implement a 2-dimensional rectangle with double precision coordinates.
| Functions | |
| mxRectangle | Constructs a new rectangle for the optional parameters. |
| Variables | |
| width | Holds the width of the rectangle. |
| height | Holds the height of the rectangle. |
| Functions | |
| setRect | Sets this rectangle to the specified values |
| getCenterX | Returns the x-coordinate of the center point. |
| getCenterY | Returns the y-coordinate of the center point. |
| add | Adds the given rectangle to this rectangle. |
| intersect | Changes this rectangle to where it overlaps with the given rectangle. |
| grow | Grows the rectangle by the given amount, that is, this method subtracts the given amount from the x- and y-coordinates and adds twice the amount to the width and height. |
| getPoint | Returns the top, left corner as a new mxPoint. |
| rotate90 | Rotates this rectangle by 90 degree around its center point. |
| equals | Returns true if the given object equals this rectangle. |
| fromRectangle | Returns a new mxRectangle which is a copy of the given rectangle. |
mxRectangle.prototype.getPoint = function()
Returns the top, left corner as a new mxPoint.
mxRectangle.fromRectangle = function( rect )
Returns a new mxRectangle which is a copy of the given rectangle.
Provides animation effects.
| Functions | |
| animateChanges | Asynchronous animated move operation. |
| cascadeOpacity | Sets the opacity on the given cell and its descendants. |
| fadeOut | Asynchronous fade-out operation. |
animateChanges: function( graph, changes, done )
Asynchronous animated move operation. See also: mxMorphing.
graph.model.addListener(mxEvent.CHANGE, function(sender, evt)
{
var changes = evt.getProperty('edit').changes;
if (changes.length < 10)
{
mxEffects.animateChanges(graph, changes);
}
});| graph | mxGraph that received the changes. |
| changes | Array of changes to be animated. |
| done | Optional function argument that is invoked after the last step of the animation. |
A singleton class that provides cross-browser helper methods. This is a global functionality. To access the functions in this class, use the global classname appended by the functionname. You may have to load chrome://global/content/contentAreaUtils.js to disable certain security restrictions in Mozilla for the <open>, <save>, <saveAs> and <copy> function.
mxUtils.error('Browser is not supported!', 200, false);| Variables | |
| errorResource | Specifies the resource key for the title of the error window. |
| closeResource | Specifies the resource key for the label of the close button. |
| errorImage | Defines the image used for error dialogs. |
| Functions | |
| removeCursors | Removes the cursors from the style of the given DOM node and its descendants. |
| getCurrentStyle | Returns the current style of the specified element. |
| parseCssNumber | Parses the given CSS numeric value adding handling for the values thin, medium and thick (2, 4 and 6). |
| setPrefixedStyle | Adds the given style with the standard name and an optional vendor prefix for the current browser. |
| hasScrollbars | Returns true if the overflow CSS property of the given node is either scroll or auto. |
| bind | Returns a wrapper function that locks the execution scope of the given function to the specified scope. |
| eval | Evaluates the given expression using eval and returns the JavaScript object that represents the expression result. |
| findNode | Returns the first node where attr equals value. |
| getFunctionName | Returns the name for the given function. |
| indexOf | Returns the index of obj in array or -1 if the array does not contain the given object. |
| forEach | Calls the given function for each element of the given array and returns the array. |
| remove | Removes all occurrences of the given object in the given array or object. |
| isNode | Returns true if the given value is an XML node with the node name and if the optional attribute has the specified value. |
| isAncestorNode | Returns true if the given ancestor is an ancestor of the given DOM node in the DOM. |
| getChildNodes | Returns an array of child nodes that are of the given node type. |
| importNode | Cross browser implementation for document.importNode. |
| createXmlDocument | Returns a new, empty XML document. |
| parseXml | Parses the specified XML string into a new XML document and returns the new document. |
| clearSelection | Clears the current selection in the page. |
| getPrettyXML | Returns a pretty printed string that represents the XML tree for the given node. |
| removeWhitespace | Removes the sibling text nodes for the given node that only consists of tabs, newlines and spaces. |
| htmlEntities | Replaces characters (less than, greater than, newlines and quotes) with their HTML entities in the given string and returns the result. |
| isVml | Returns true if the given node is in the VML namespace. |
| getXml | Returns the XML content of the specified node. |
| extractTextWithWhitespace | Returns the text content of the specified node. |
| replaceTrailingNewlines | Replaces each trailing newline with the given pattern. |
| getTextContent | Returns the text content of the specified node. |
| setTextContent | Sets the text content of the specified node. |
| getInnerHtml | Returns the inner HTML for the given node as a string or an empty string if no node was specified. |
| getOuterHtml | Returns the outer HTML for the given node as a string or an empty string if no node was specified. |
| write | Creates a text node for the given string and appends it to the given parent. |
| writeln | Creates a text node for the given string and appends it to the given parent with an additional linefeed. |
| br | Appends a linebreak to the given parent and returns the linebreak. |
| button | Returns a new button with the given level and function as an onclick event handler. |
| para | Appends a new paragraph with the given text to the specified parent and returns the paragraph. |
| addTransparentBackgroundFilter | Adds a transparent background to the filter of the given node. |
| linkAction | Adds a hyperlink to the specified parent that invokes action on the specified editor. |
| linkInvoke | Adds a hyperlink to the specified parent that invokes the specified function on the editor passing along the specified argument. |
| link | Adds a hyperlink to the specified parent and invokes the given function when the link is clicked. |
| getDocumentSize | Returns the client size for the current document as an mxRectangle. |
| fit | Makes sure the given node is inside the visible area of the window. |
| load | Loads the specified URL synchronously and returns the mxXmlRequest. |
| get | Loads the specified URL asynchronously and invokes the given functions depending on the request status. |
| getAll | Loads the URLs in the given array asynchronously and invokes the given function if all requests returned with a valid 2xx status. |
| post | Posts the specified params to the given URL asynchronously and invokes the given functions depending on the request status. |
| submit | Submits the given parameters to the specified URL using mxXmlRequest.simulate and returns the mxXmlRequest. |
| loadInto | Loads the specified URL asynchronously into the specified document, invoking onload after the document has been loaded. |
| getValue | Returns the value for the given key in the given associative array or the given default value if the value is null. |
| getNumber | Returns the numeric value for the given key in the given associative array or the given default value (or 0) if the value is null. |
| getColor | Returns the color value for the given key in the given associative array or the given default value if the value is null. |
| clone | Recursively clones the specified object ignoring all fieldnames in the given array of transient fields. |
| equalPoints | Compares all mxPoints in the given lists. |
| equalEntries | Returns true if all properties of the given objects are equal. |
| removeDuplicates | Removes all duplicates from the given array. |
| isNaN | Returns true if the given value is of type number and isNaN returns true. |
| extend | Assigns a copy of the superclass prototype to the subclass prototype. |
| toString | Returns a textual representation of the specified object. |
| toRadians | Converts the given degree to radians. |
| toDegree | Converts the given radians to degree. |
| arcToCurves | Converts the given arc to a series of curves. |
| getBoundingBox | Returns the bounding box for the rotated rectangle. |
| getRotatedPoint | Rotates the given point by the given cos and sin. |
| reversePortConstraints | Reverse the port constraint bitmask. |
| findNearestSegment | Finds the index of the nearest segment on the given cell state for the specified coordinate pair. |
| getDirectedBounds | Adds the given margins to the given rectangle and rotates and flips the rectangle according to the respective styles in style. |
| getPerimeterPoint | Returns the intersection between the polygon defined by the array of points and the line between center and point. |
| rectangleIntersectsSegment | Returns true if the given rectangle intersects the given segment. |
| contains | Returns true if the specified point (x, y) is contained in the given rectangle. |
| intersects | Returns true if the two rectangles intersect. |
| intersects | Returns true if the two rectangles intersect. |
| getOffset | Returns the offset for the specified container as an mxPoint. |
| getDocumentScrollOrigin | Returns the scroll origin of the given document or the current document if no document is given. |
| getScrollOrigin | Returns the top, left corner of the viewrect as an mxPoint. |
| convertPoint | Converts the specified point (x, y) using the offset of the specified container and returns a new mxPoint with the result. |
| ltrim | Strips all whitespaces from the beginning of the string. |
| rtrim | Strips all whitespaces from the end of the string. |
| trim | Strips all whitespaces from both end of the string. |
| isNumeric | Returns true if the specified value is numeric, that is, if it is not null, not an empty string, not a HEX number and isNaN returns false. |
| isInteger | Returns true if the given value is an valid integer number. |
| mod | Returns the remainder of division of n by m. |
| intersection | Returns the intersection of two lines as an mxPoint. |
| ptSegDistSq | Returns the square distance between a segment and a point. |
| ptLineDist | Returns the distance between a line defined by two points and a point. |
| relativeCcw | Returns 1 if the given point on the right side of the segment, 0 if its on the segment, and -1 if the point is on the left side of the segment. |
| animateChanges | See mxEffects.animateChanges. |
| cascadeOpacity | See mxEffects.cascadeOpacity. |
| fadeOut | See mxEffects.fadeOut. |
| setOpacity | Sets the opacity of the specified DOM node to the given value in %. |
| createImage | Creates and returns an image (IMG node) or VML image (v:image) in IE6 in quirks mode. |
| sortCells | Sorts the given cells according to the order in the cell hierarchy. |
| getStylename | Returns the stylename in a style of the form [(stylename|key=value);] or an empty string if the given style does not contain a stylename. |
| getStylenames | Returns the stylenames in a style of the form [(stylename|key=value);] or an empty array if the given style does not contain any stylenames. |
| indexOfStylename | Returns the index of the given stylename in the given style. |
| addStylename | Adds the specified stylename to the given style if it does not already contain the stylename. |
| removeStylename | Removes all occurrences of the specified stylename in the given style and returns the updated style. |
| removeAllStylenames | Removes all stylenames from the given style and returns the updated style. |
| setCellStyles | Assigns the value for the given key in the styles of the given cells, or removes the key from the styles if the value is null. |
| setStyle | Adds or removes the given key, value pair to the style and returns the new style. |
| setCellStyleFlags | Sets or toggles the flag bit for the given key in the cell’s styles. |
| setStyleFlag | Sets or removes the given key from the specified style and returns the new style. |
| getAlignmentAsPoint | Returns an mxPoint that represents the horizontal and vertical alignment for numeric computations. |
| getSizeForString | Returns an mxRectangle with the size (width and height in pixels) of the given string. |
| getViewXml | |
| getScaleForPageCount | Returns the scale to be used for printing the graph with the given bounds across the specifies number of pages with the given format. |
| show | Copies the styles and the markup from the graph’s container into the given document and removes all cursor styles. |
| printScreen | Prints the specified graph using a new window and the built-in print dialog. |
| popup | Shows the specified text content in a new mxWindow or a new browser window if isInternalWindow is false. |
| alert | Displayss the given alert in a new dialog. |
| prompt | Displays the given message in a prompt dialog. |
| confirm | Displays the given message in a confirm dialog. |
| error | Displays the given error message in a new mxWindow of the given width. |
| makeDraggable | Configures the given DOM element to act as a drag source for the specified graph. |
eval: function( expr )
Evaluates the given expression using eval and returns the JavaScript object that represents the expression result. Supports evaluation of expressions that define functions and returns the function object for these expressions.
| expr | A string that represents a JavaScript expression. |
remove: function( obj, array )
Removes all occurrences of the given object in the given array or object. If there are multiple occurrences of the object, be they associative or as an array entry, all occurrences are removed from the array or deleted from the object. By removing the object from the array, all elements following the removed element are shifted by one step towards the beginning of the array.
The length of arrays is not modified inside this function.
| obj | Object to find in the given array. |
| array | Array to check for the given obj. |
isNode: function( value, nodeName, attributeName, attributeValue )
Returns true if the given value is an XML node with the node name and if the optional attribute has the specified value.
This implementation assumes that the given value is a DOM node if the nodeType property is numeric, that is, if isNaN returns false for value.nodeType.
| value | Object that should be examined as a node. |
| nodeName | String that specifies the node name. |
| attributeName | Optional attribute name to check. |
| attributeValue | Optional attribute value to check. |
getChildNodes: function( node, nodeType )
Returns an array of child nodes that are of the given node type.
| node | Parent DOM node to return the children from. |
| nodeType | Optional node type to return. Default is mxConstants.NODETYPE_ELEMENT. |
importNode: function( doc, node, allChildren )
Cross browser implementation for document.importNode. Uses document.importNode in all browsers but IE, where the node is cloned by creating a new node and copying all attributes and children into it using importNode, recursively.
| doc | Document to import the node into. |
| node | Node to be imported. |
| allChildren | If all children should be imported. |
parseXml: function()
Parses the specified XML string into a new XML document and returns the new document.
var doc = mxUtils.parseXml( '<mxGraphModel><root><MyDiagram id="0"><mxCell/></MyDiagram>'+ '<MyLayer id="1"><mxCell parent="0" /></MyLayer><MyObject id="2">'+ '<mxCell style="strokeColor=blue;fillColor=red" parent="1" vertex="1">'+ '<mxGeometry x="10" y="10" width="80" height="30" as="geometry"/>'+ '</mxCell></MyObject></root></mxGraphModel>');
| xml | String that contains the XML data. |
Returns a pretty printed string that represents the XML tree for the given node. This method should only be used to print XML for reading, use getXml instead to obtain a string for processing.
| node | DOM node to return the XML for. |
| tab | Optional string that specifies the indentation for one level. Default is two spaces. |
| indent | Optional string that represents the current indentation. Default is an empty string. |
getXml: function( node, linefeed )
Returns the XML content of the specified node. For Internet Explorer, all \r\n\t[\t]* are removed from the XML string and the remaining \r\n are replaced by \n. All \n are then replaced with linefeed, or 
 if no linefeed is defined.
| node | DOM node to return the XML for. |
| linefeed | Optional string that linefeeds are converted into. Default is 
 |
button: function( label, funct, doc )
Returns a new button with the given level and function as an onclick event handler.
document.body.appendChild(mxUtils.button('Test', function(evt)
{
alert('Hello, World!');
}));| label | String that represents the label of the button. |
| funct | Function to be called if the button is pressed. |
| doc | Optional document to be used for creating the button. Default is the current document. |
linkAction: function( parent, text, editor, action, pad )
Adds a hyperlink to the specified parent that invokes action on the specified editor.
| parent | DOM node to contain the new link. |
| text | String that is used as the link label. |
| editor | mxEditor that will execute the action. |
| action | String that defines the name of the action to be executed. |
| pad | Optional left-padding for the link. Default is 0. |
linkInvoke: function( parent, text, editor, functName, arg, pad )
Adds a hyperlink to the specified parent that invokes the specified function on the editor passing along the specified argument. The function name is the name of a function of the editor instance, not an action name.
| parent | DOM node to contain the new link. |
| text | String that is used as the link label. |
| editor | mxEditor instance to execute the function on. |
| functName | String that represents the name of the function. |
| arg | Object that represents the argument to the function. |
| pad | Optional left-padding for the link. Default is 0. |
link: function( parent, text, funct, pad )
Adds a hyperlink to the specified parent and invokes the given function when the link is clicked.
| parent | DOM node to contain the new link. |
| text | String that is used as the link label. |
| funct | Function to execute when the link is clicked. |
| pad | Optional left-padding for the link. Default is 0. |
getDocumentSize: function()
Returns the client size for the current document as an mxRectangle.
load: function( url )
Loads the specified URL synchronously and returns the mxXmlRequest. Throws an exception if the file cannot be loaded. See mxUtils.get for an asynchronous implementation.
try
{
var req = mxUtils.load(filename);
var root = req.getDocumentElement();
// Process XML DOM...
}
catch (ex)
{
mxUtils.alert('Cannot load '+filename+': '+ex);
}| url | URL to get the data from. |
get: function( url, onload, onerror, binary, timeout, ontimeout )
Loads the specified URL asynchronously and invokes the given functions depending on the request status. Returns the mxXmlRequest in use. Both functions take the mxXmlRequest as the only parameter. See mxUtils.load for a synchronous implementation.
mxUtils.get(url, function(req)
{
var node = req.getDocumentElement();
// Process XML DOM...
});So for example, to load a diagram into an existing graph model, the following code is used.
mxUtils.get(url, function(req)
{
var node = req.getDocumentElement();
var dec = new mxCodec(node.ownerDocument);
dec.decode(node, graph.getModel());
});| url | URL to get the data from. |
| onload | Optional function to execute for a successful response. |
| onerror | Optional function to execute on error. |
| binary | Optional boolean parameter that specifies if the request is binary. |
| timeout | Optional timeout in ms before calling ontimeout. |
| ontimeout | Optional function to execute on timeout. |
getAll: function( urls, onload, onerror )
Loads the URLs in the given array asynchronously and invokes the given function if all requests returned with a valid 2xx status. The error handler is invoked once on the first error or invalid response.
| urls | Array of URLs to be loaded. |
| onload | Callback with array of mxXmlRequests. |
| onerror | Optional function to execute on error. |
post: function( url, params, onload, onerror )
Posts the specified params to the given URL asynchronously and invokes the given functions depending on the request status. Returns the mxXmlRequest in use. Both functions take the mxXmlRequest as the only parameter. Make sure to use encodeURIComponent for the parameter values.
mxUtils.post(url, 'key=value', function(req)
{
mxUtils.alert('Ready: '+req.isReady()+' Status: '+req.getStatus());
// Process req.getDocumentElement() using DOM API if OK...
});| url | URL to get the data from. |
| params | Parameters for the post request. |
| onload | Optional function to execute for a successful response. |
| onerror | Optional function to execute on error. |
submit: function( url, params, doc, target )
Submits the given parameters to the specified URL using mxXmlRequest.simulate and returns the mxXmlRequest. Make sure to use encodeURIComponent for the parameter values.
| url | URL to get the data from. |
| params | Parameters for the form. |
| doc | Document to create the form in. |
| target | Target to send the form result to. |
loadInto: function( url, doc, onload )
Loads the specified URL asynchronously into the specified document, invoking onload after the document has been loaded. This implementation does not use mxXmlRequest, but the document.load method.
| url | URL to get the data from. |
| doc | The document to load the URL into. |
| onload | Function to execute when the URL has been loaded. |
getValue: function( array, key, defaultValue )
Returns the value for the given key in the given associative array or the given default value if the value is null.
| array | Associative array that contains the value for the key. |
| key | Key whose value should be returned. |
| defaultValue | Value to be returned if the value for the given key is null. |
getNumber: function( array, key, defaultValue )
Returns the numeric value for the given key in the given associative array or the given default value (or 0) if the value is null. The value is converted to a numeric value using the Number function.
| array | Associative array that contains the value for the key. |
| key | Key whose value should be returned. |
| defaultValue | Value to be returned if the value for the given key is null. Default is 0. |
getColor: function( array, key, defaultValue )
Returns the color value for the given key in the given associative array or the given default value if the value is null. If the value is mxConstants.NONE then null is returned.
| array | Associative array that contains the value for the key. |
| key | Key whose value should be returned. |
| defaultValue | Value to be returned if the value for the given key is null. Default is null. |
clone: function( obj, transients, shallow )
Recursively clones the specified object ignoring all fieldnames in the given array of transient fields. mxObjectIdentity.FIELD_NAME is always ignored by this function.
| obj | Object to be cloned. |
| transients | Optional array of strings representing the fieldname to be ignored. |
| shallow | Optional boolean argument to specify if a shallow clone should be created, that is, one where all object references are not cloned or, in other words, one where only atomic (strings, numbers) values are cloned. Default is false. |
extend: function( ctor, superCtor )
Assigns a copy of the superclass prototype to the subclass prototype. Note that this does not call the constructor of the superclass at this point, the superclass constructor should be called explicitely in the subclass constructor. Below is an example.
MyGraph = function(container, model, renderHint, stylesheet)
{
mxGraph.call(this, container, model, renderHint, stylesheet);
}
mxUtils.extend(MyGraph, mxGraph);| ctor | Constructor of the subclass. |
| superCtor | Constructor of the superclass. |
getBoundingBox: function( rect, rotation, cx )
Returns the bounding box for the rotated rectangle.
| rect | mxRectangle to be rotated. |
| angle | Number that represents the angle (in degrees). |
| cx | Optional mxPoint that represents the rotation center. If no rotation center is given then the center of rect is used. |
rectangleIntersectsSegment: function( bounds, p1, p2 )
Returns true if the given rectangle intersects the given segment.
| bounds | mxRectangle that represents the rectangle. |
| p1 | mxPoint that represents the first point of the segment. |
| p2 | mxPoint that represents the second point of the segment. |
contains: function( bounds, x, y )
Returns true if the specified point (x, y) is contained in the given rectangle.
| bounds | mxRectangle that represents the area. |
| x | X-coordinate of the point. |
| y | Y-coordinate of the point. |
intersects: function( a, b )
Returns true if the two rectangles intersect.
| a | mxRectangle to be checked for intersection. |
| b | mxRectangle to be checked for intersection. |
intersectsHotspot: function( state, x, y, hotspot, min, max )
Returns true if the two rectangles intersect.
| a | mxRectangle to be checked for intersection. |
| b | mxRectangle to be checked for intersection. |
getOffset: function( container, scrollOffset )
Returns the offset for the specified container as an mxPoint. The offset is the distance from the top left corner of the container to the top left corner of the document.
| container | DOM node to return the offset for. |
| scollOffset | Optional boolean to add the scroll offset of the document. Default is false. |
getScrollOrigin: function( node, includeAncestors, includeDocument )
Returns the top, left corner of the viewrect as an mxPoint.
| node | DOM node whose scroll origin should be returned. |
| includeAncestors | Whether the scroll origin of the ancestors should be included. Default is false. |
| includeDocument | Whether the scroll origin of the document should be included. Default is true. |
convertPoint: function( container, x, y )
Converts the specified point (x, y) using the offset of the specified container and returns a new mxPoint with the result.
var pt = mxUtils.convertPoint(graph.container, mxEvent.getClientX(evt), mxEvent.getClientY(evt));
| container | DOM node to use for the offset. |
| x | X-coordinate of the point to be converted. |
| y | Y-coordinate of the point to be converted. |
ltrim: function( str, chars )
Strips all whitespaces from the beginning of the string. Without the second parameter, this will trim these characters:
rtrim: function( str, chars )
Strips all whitespaces from the end of the string. Without the second parameter, this will trim these characters:
trim: function( str, chars )
Strips all whitespaces from both end of the string. Without the second parameter, Javascript function will trim these characters:
intersection: function ( x0, y0, x1, y1, x2, y2, x3, y3 )
Returns the intersection of two lines as an mxPoint.
| x0 | X-coordinate of the first line’s startpoint. |
| y0 | X-coordinate of the first line’s startpoint. |
| x1 | X-coordinate of the first line’s endpoint. |
| y1 | Y-coordinate of the first line’s endpoint. |
| x2 | X-coordinate of the second line’s startpoint. |
| y2 | Y-coordinate of the second line’s startpoint. |
| x3 | X-coordinate of the second line’s endpoint. |
| y3 | Y-coordinate of the second line’s endpoint. |
ptSegDistSq: function( x1, y1, x2, y2, px, py )
Returns the square distance between a segment and a point. To get the distance between a point and a line (with infinite length) use mxUtils.ptLineDist.
| x1 | X-coordinate of the startpoint of the segment. |
| y1 | Y-coordinate of the startpoint of the segment. |
| x2 | X-coordinate of the endpoint of the segment. |
| y2 | Y-coordinate of the endpoint of the segment. |
| px | X-coordinate of the point. |
| py | Y-coordinate of the point. |
ptLineDist: function( x1, y1, x2, y2, px, py )
Returns the distance between a line defined by two points and a point. To get the distance between a point and a segment (with a specific length) use <mxUtils.ptSeqDistSq>.
| x1 | X-coordinate of point 1 of the line. |
| y1 | Y-coordinate of point 1 of the line. |
| x2 | X-coordinate of point 1 of the line. |
| y2 | Y-coordinate of point 1 of the line. |
| px | X-coordinate of the point. |
| py | Y-coordinate of the point. |
relativeCcw: function( x1, y1, x2, y2, px, py )
Returns 1 if the given point on the right side of the segment, 0 if its on the segment, and -1 if the point is on the left side of the segment.
| x1 | X-coordinate of the startpoint of the segment. |
| y1 | Y-coordinate of the startpoint of the segment. |
| x2 | X-coordinate of the endpoint of the segment. |
| y2 | Y-coordinate of the endpoint of the segment. |
| px | X-coordinate of the point. |
| py | Y-coordinate of the point. |
animateChanges: function( graph, changes )
See mxEffects.animateChanges. This is for backwards compatibility and will be removed later.
cascadeOpacity: function( graph, cell, opacity )
See mxEffects.cascadeOpacity. This is for backwards compatibility and will be removed later.
fadeOut: function( node, from, remove, step, delay, isEnabled )
See mxEffects.fadeOut. This is for backwards compatibility and will be removed later.
setCellStyles: function( model, cells, key, value )
Assigns the value for the given key in the styles of the given cells, or removes the key from the styles if the value is null.
| model | mxGraphModel to execute the transaction in. |
| cells | Array of mxCells to be updated. |
| key | Key of the style to be changed. |
| value | New value for the given key. |
setStyle: function( style, key, value )
Adds or removes the given key, value pair to the style and returns the new style. If value is null or zero length then the key is removed from the style. This is for cell styles, not for CSS styles.
| style | String of the form [(stylename|key=value);]. |
| key | Key of the style to be changed. |
| value | New value for the given key. |
setCellStyleFlags: function( model, cells, key, flag, value )
Sets or toggles the flag bit for the given key in the cell’s styles. If value is null then the flag is toggled.
var cells = graph.getSelectionCells();
mxUtils.setCellStyleFlags(graph.model,
cells,
mxConstants.STYLE_FONTSTYLE,
mxConstants.FONT_BOLD);Toggles the bold font style.
| model | mxGraphModel that contains the cells. |
| cells | Array of mxCells to change the style for. |
| key | Key of the style to be changed. |
| flag | Integer for the bit to be changed. |
| value | Optional boolean value for the flag. |
setStyleFlag: function( style, key, flag, value )
Sets or removes the given key from the specified style and returns the new style. If value is null then the flag is toggled.
| style | String of the form [(stylename|key=value);]. |
| key | Key of the style to be changed. |
| flag | Integer for the bit to be changed. |
| value | Optional boolean value for the given flag. |
getAlignmentAsPoint: function( align, valign )
Returns an mxPoint that represents the horizontal and vertical alignment for numeric computations. X is -0.5 for center, -1 for right and 0 for left alignment. Y is -0.5 for middle, -1 for bottom and 0 for top alignment. Default values for missing arguments is top, left.
getSizeForString: function( text, fontSize, fontFamily, textWidth )
Returns an mxRectangle with the size (width and height in pixels) of the given string. The string may contain HTML markup. Newlines should be converted to br before calling this method. The caller is responsible for sanitizing the HTML markup.
var label = graph.getLabel(cell).replace(/\n/g, "<br>"); var size = graph.getSizeForString(label);
| text | String whose size should be returned. |
| fontSize | Integer that specifies the font size in pixels. Default is mxConstants.DEFAULT_FONTSIZE. |
| fontFamily | String that specifies the name of the font family. Default is mxConstants.DEFAULT_FONTFAMILY. |
| textWidth | Optional width for text wrapping. |
getScaleForPageCount: function( pageCount, graph, pageFormat, border )
Returns the scale to be used for printing the graph with the given bounds across the specifies number of pages with the given format. The scale is always computed such that it given the given amount or fewer pages in the print output. See mxPrintPreview for an example.
| pageCount | Specifies the number of pages in the print output. |
| graph | mxGraph that should be printed. |
| pageFormat | Optional mxRectangle that specifies the page format. Default is mxConstants.PAGE_FORMAT_A4_PORTRAIT. |
| border | The border along each side of every page. |
show: function( graph, doc, x0, y0, w, h )
Copies the styles and the markup from the graph’s container into the given document and removes all cursor styles. The document is returned.
This function should be called from within the document with the graph. If you experience problems with missing stylesheets in IE then try adding the domain to the trusted sites.
| graph | mxGraph to be copied. |
| doc | Document where the new graph is created. |
| x0 | X-coordinate of the graph view origin. Default is 0. |
| y0 | Y-coordinate of the graph view origin. Default is 0. |
| w | Optional width of the graph view. |
| h | Optional height of the graph view. |
printScreen: function( graph )
Prints the specified graph using a new window and the built-in print dialog.
This function should be called from within the document with the graph.
| graph | mxGraph to be printed. |
popup: function( content, isInternalWindow )
Shows the specified text content in a new mxWindow or a new browser window if isInternalWindow is false.
| content | String that specifies the text to be displayed. |
| isInternalWindow | Optional boolean indicating if an mxWindow should be used instead of a new browser window. Default is false. |
error: function( message, width, close, icon )
Displays the given error message in a new mxWindow of the given width. If close is true then an additional close button is added to the window. The optional icon specifies the icon to be used for the window. Default is mxUtils.errorImage.
| message | String specifying the message to be displayed. |
| width | Integer specifying the width of the window. |
| close | Optional boolean indicating whether to add a close button. |
| icon | Optional icon for the window decoration. |
makeDraggable: function( element, graphF, funct, dragElement, dx, dy, autoscroll, scalePreview, highlightDropTargets, getDropTarget )
Configures the given DOM element to act as a drag source for the specified graph. Returns a a new mxDragSource. If <mxDragSource.guideEnabled> is enabled then the x and y arguments must be used in funct to match the preview location.
var funct = function(graph, evt, cell, x, y)
{
if (graph.canImportCell(cell))
{
var parent = graph.getDefaultParent();
var vertex = null;
graph.getModel().beginUpdate();
try
{
vertex = graph.insertVertex(parent, null, 'Hello', x, y, 80, 30);
}
finally
{
graph.getModel().endUpdate();
}
graph.setSelectionCell(vertex);
}
}
var img = document.createElement('img');
img.setAttribute('src', 'editors/images/rectangle.gif');
img.style.position = 'absolute';
img.style.left = '0px';
img.style.top = '0px';
img.style.width = '16px';
img.style.height = '16px';
var dragImage = img.cloneNode(true);
dragImage.style.width = '32px';
dragImage.style.height = '32px';
mxUtils.makeDraggable(img, graph, funct, dragImage);
document.body.appendChild(img);| element | DOM element to make draggable. |
| graphF | mxGraph that acts as the drop target or a function that takes a mouse event and returns the current mxGraph. |
| funct | Function to execute on a successful drop. |
| dragElement | Optional DOM node to be used for the drag preview. |
| dx | Optional horizontal offset between the cursor and the drag preview. |
| dy | Optional vertical offset between the cursor and the drag preview. |
| autoscroll | Optional boolean that specifies if autoscroll should be used. Default is mxGraph.autoscroll. |
| scalePreview | Optional boolean that specifies if the preview element should be scaled according to the graph scale. If this is true, then the offsets will also be scaled. Default is false. |
| highlightDropTargets | Optional boolean that specifies if dropTargets should be highlighted. Default is true. |
| getDropTarget | Optional function to return the drop target for a given location (x, y). Default is mxGraph.getCellAt. |
Defines various global constants.
| Variables | |
| DEFAULT_HOTSPOT | Defines the portion of the cell which is to be used as a connectable region. |
| MIN_HOTSPOT_SIZE | Defines the minimum size in pixels of the portion of the cell which is to be used as a connectable region. |
| MAX_HOTSPOT_SIZE | Defines the maximum size in pixels of the portion of the cell which is to be used as a connectable region. |
| RENDERING_HINT_EXACT | Defines the exact rendering hint. |
| RENDERING_HINT_FASTER | Defines the faster rendering hint. |
| RENDERING_HINT_FASTEST | Defines the fastest rendering hint. |
| DIALECT_SVG | Defines the SVG display dialect name. |
| DIALECT_VML | Defines the VML display dialect name. |
| DIALECT_MIXEDHTML | Defines the mixed HTML display dialect name. |
| DIALECT_PREFERHTML | Defines the preferred HTML display dialect name. |
| DIALECT_STRICTHTML | Defines the strict HTML display dialect. |
| NS_SVG | Defines the SVG namespace. |
| NS_XHTML | Defines the XHTML namespace. |
| NS_XLINK | Defines the XLink namespace. |
| SHADOWCOLOR | Defines the color to be used to draw shadows in shapes and windows. |
| VML_SHADOWCOLOR | Used for shadow color in filters where transparency is not supported (Microsoft Internet Explorer). |
| SHADOW_OFFSET_X | Specifies the x-offset of the shadow. |
| SHADOW_OFFSET_Y | Specifies the y-offset of the shadow. |
| SHADOW_OPACITY | Defines the opacity for shadows. |
| NODETYPE_ELEMENT | DOM node of type ELEMENT. |
| NODETYPE_ATTRIBUTE | DOM node of type ATTRIBUTE. |
| NODETYPE_TEXT | DOM node of type TEXT. |
| NODETYPE_CDATA | DOM node of type CDATA. |
| NODETYPE_ENTITY_REFERENCE | DOM node of type ENTITY_REFERENCE. |
| NODETYPE_ENTITY | DOM node of type ENTITY. |
| NODETYPE_PROCESSING_INSTRUCTION | DOM node of type PROCESSING_INSTRUCTION. |
| NODETYPE_COMMENT | DOM node of type COMMENT. |
| NODETYPE_DOCUMENT | DOM node of type DOCUMENT. |
| NODETYPE_DOCUMENTTYPE | DOM node of type DOCUMENTTYPE. |
| NODETYPE_DOCUMENT_FRAGMENT | DOM node of type DOCUMENT_FRAGMENT. |
| NODETYPE_NOTATION | DOM node of type NOTATION. |
| TOOLTIP_VERTICAL_OFFSET | Defines the vertical offset for the tooltip. |
| DEFAULT_VALID_COLOR | Specifies the default valid color. |
| DEFAULT_INVALID_COLOR | Specifies the default invalid color. |
| OUTLINE_HIGHLIGHT_COLOR | Specifies the default highlight color for shape outlines. |
| OUTLINE_HIGHLIGHT_COLOR | Defines the strokewidth to be used for shape outlines. |
| HIGHLIGHT_STROKEWIDTH | Defines the strokewidth to be used for the highlights. |
| CONSTRAINT_HIGHLIGHT_SIZE | Size of the constraint highlight (in px). |
| HIGHLIGHT_OPACITY | Opacity (in %) used for the highlights (including outline). |
| CURSOR_MOVABLE_VERTEX | Defines the cursor for a movable vertex. |
| CURSOR_MOVABLE_EDGE | Defines the cursor for a movable edge. |
| CURSOR_LABEL_HANDLE | Defines the cursor for a movable label. |
| CURSOR_TERMINAL_HANDLE | Defines the cursor for a terminal handle. |
| CURSOR_BEND_HANDLE | Defines the cursor for a movable bend. |
| CURSOR_VIRTUAL_BEND_HANDLE | Defines the cursor for a movable bend. |
| CURSOR_CONNECT | Defines the cursor for a connectable state. |
| HIGHLIGHT_COLOR | Defines the color to be used for the cell highlighting. |
| TARGET_HIGHLIGHT_COLOR | Defines the color to be used for highlighting a target cell for a new or changed connection. |
| INVALID_CONNECT_TARGET_COLOR | Defines the color to be used for highlighting a invalid target cells for a new or changed connections. |
| DROP_TARGET_COLOR | Defines the color to be used for the highlighting target parent cells (for drag and drop). |
| VALID_COLOR | Defines the color to be used for the coloring valid connection previews. |
| INVALID_COLOR | Defines the color to be used for the coloring invalid connection previews. |
| EDGE_SELECTION_COLOR | Defines the color to be used for the selection border of edges. |
| VERTEX_SELECTION_COLOR | Defines the color to be used for the selection border of vertices. |
| VERTEX_SELECTION_STROKEWIDTH | Defines the strokewidth to be used for vertex selections. |
| EDGE_SELECTION_STROKEWIDTH | Defines the strokewidth to be used for edge selections. |
| SELECTION_DASHED | Defines the dashed state to be used for the vertex selection border. |
| SELECTION_DASHED | Defines the dashed state to be used for the edge selection border. |
| GUIDE_COLOR | Defines the color to be used for the guidelines in mxGraphHandler. |
| GUIDE_STROKEWIDTH | Defines the strokewidth to be used for the guidelines in mxGraphHandler. |
| OUTLINE_COLOR | Defines the color to be used for the outline rectangle border. |
| OUTLINE_STROKEWIDTH | Defines the strokewidth to be used for the outline rectangle stroke width. |
| HANDLE_SIZE | Defines the default size for handles. |
| LABEL_HANDLE_SIZE | Defines the default size for label handles. |
| HANDLE_FILLCOLOR | Defines the color to be used for the handle fill color. |
| HANDLE_STROKECOLOR | Defines the color to be used for the handle stroke color. |
| LABEL_HANDLE_FILLCOLOR | Defines the color to be used for the label handle fill color. |
| CONNECT_HANDLE_FILLCOLOR | Defines the color to be used for the connect handle fill color. |
| LOCKED_HANDLE_FILLCOLOR | Defines the color to be used for the locked handle fill color. |
| OUTLINE_HANDLE_FILLCOLOR | Defines the color to be used for the outline sizer fill color. |
| OUTLINE_HANDLE_STROKECOLOR | Defines the color to be used for the outline sizer stroke color. |
| DEFAULT_FONTFAMILY | Defines the default family for all fonts. |
| DEFAULT_FONTSIZE | Defines the default size (in px). |
| DEFAULT_TEXT_DIRECTION | Defines the default value for the STYLE_TEXT_DIRECTION if no value is defined for it in the style. |
| LINE_HEIGHT | Defines the default line height for text labels. |
| WORD_WRAP | Defines the CSS value for the word-wrap property. |
| ABSOLUTE_LINE_HEIGHT | Specifies if absolute line heights should be used (px) in CSS. |
| DEFAULT_FONTSTYLE | Defines the default style for all fonts. |
| DEFAULT_STARTSIZE | Defines the default start size for swimlanes. |
| DEFAULT_MARKERSIZE | Defines the default size for all markers. |
| DEFAULT_IMAGESIZE | Defines the default width and height for images used in the label shape. |
| ENTITY_SEGMENT | Defines the length of the horizontal segment of an Entity Relation. |
| RECTANGLE_ROUNDING_FACTOR | Defines the rounding factor for rounded rectangles in percent between 0 and 1. |
| LINE_ARCSIZE | Defines the size of the arcs for rounded edges. |
| ARROW_SPACING | Defines the spacing between the arrow shape and its terminals. |
| ARROW_WIDTH | Defines the width of the arrow shape. |
| ARROW_SIZE | Defines the size of the arrowhead in the arrow shape. |
| PAGE_FORMAT_A4_PORTRAIT | Defines the rectangle for the A4 portrait page format. |
| PAGE_FORMAT_A4_PORTRAIT | Defines the rectangle for the A4 portrait page format. |
| PAGE_FORMAT_LETTER_PORTRAIT | Defines the rectangle for the Letter portrait page format. |
| PAGE_FORMAT_LETTER_PORTRAIT | Defines the rectangle for the Letter portrait page format. |
| NONE | Defines the value for none. |
| STYLE_PERIMETER | Defines the key for the perimeter style. |
| STYLE_SOURCE_PORT | Defines the ID of the cell that should be used for computing the perimeter point of the source for an edge. |
| STYLE_TARGET_PORT | Defines the ID of the cell that should be used for computing the perimeter point of the target for an edge. |
| STYLE_PORT_CONSTRAINT | Defines the direction(s) that edges are allowed to connect to cells in. |
| STYLE_PORT_CONSTRAINT_ROTATION | Define whether port constraint directions are rotated with vertex rotation. |
| STYLE_SOURCE_PORT_CONSTRAINT | Defines the direction(s) that edges are allowed to connect to sources in. |
| STYLE_TARGET_PORT_CONSTRAINT | Defines the direction(s) that edges are allowed to connect to targets in. |
| STYLE_OPACITY | Defines the key for the opacity style. |
| STYLE_FILL_OPACITY | Defines the key for the fill opacity style. |
| STYLE_STROKE_OPACITY | Defines the key for the stroke opacity style. |
| STYLE_TEXT_OPACITY | Defines the key for the text opacity style. |
| STYLE_TEXT_DIRECTION | Defines the key for the text direction style. |
| STYLE_OVERFLOW | Defines the key for the overflow style. |
| STYLE_ORTHOGONAL | Defines if the connection points on either end of the edge should be computed so that the edge is vertical or horizontal if possible and if the point is not at a fixed location. |
| STYLE_EXIT_X | Defines the key for the horizontal relative coordinate connection point of an edge with its source terminal. |
| STYLE_EXIT_Y | Defines the key for the vertical relative coordinate connection point of an edge with its source terminal. |
| STYLE_EXIT_DX | Defines the key for the horizontal offset of the connection point of an edge with its source terminal. |
| STYLE_EXIT_DY | Defines the key for the vertical offset of the connection point of an edge with its source terminal. |
| STYLE_EXIT_PERIMETER | Defines if the perimeter should be used to find the exact entry point along the perimeter of the source. |
| STYLE_ENTRY_X | Defines the key for the horizontal relative coordinate connection point of an edge with its target terminal. |
| STYLE_ENTRY_Y | Defines the key for the vertical relative coordinate connection point of an edge with its target terminal. |
| STYLE_ENTRY_DX | Defines the key for the horizontal offset of the connection point of an edge with its target terminal. |
| STYLE_ENTRY_DY | Defines the key for the vertical offset of the connection point of an edge with its target terminal. |
| STYLE_ENTRY_PERIMETER | Defines if the perimeter should be used to find the exact entry point along the perimeter of the target. |
| STYLE_WHITE_SPACE | Defines the key for the white-space style. |
| STYLE_ROTATION | Defines the key for the rotation style. |
| STYLE_FILLCOLOR | Defines the key for the fill color. |
| STYLE_POINTER_EVENTS | Specifies if pointer events should be fired on transparent backgrounds. |
| STYLE_SWIMLANE_FILLCOLOR | Defines the key for the fill color of the swimlane background. |
| STYLE_MARGIN | Defines the key for the margin between the ellipses in the double ellipse shape. |
| STYLE_GRADIENTCOLOR | Defines the key for the gradient color. |
| STYLE_GRADIENT_DIRECTION | Defines the key for the gradient direction. |
| STYLE_STROKECOLOR | Defines the key for the strokeColor style. |
| STYLE_SEPARATORCOLOR | Defines the key for the separatorColor style. |
| STYLE_STROKEWIDTH | Defines the key for the strokeWidth style. |
| STYLE_ALIGN | Defines the key for the align style. |
| STYLE_VERTICAL_ALIGN | Defines the key for the verticalAlign style. |
| STYLE_LABEL_WIDTH | Defines the key for the width of the label if the label position is not center. |
| STYLE_LABEL_POSITION | Defines the key for the horizontal label position of vertices. |
| STYLE_VERTICAL_LABEL_POSITION | Defines the key for the vertical label position of vertices. |
| STYLE_IMAGE_ASPECT | Defines the key for the image aspect style. |
| STYLE_IMAGE_ALIGN | Defines the key for the align style. |
| STYLE_IMAGE_VERTICAL_ALIGN | Defines the key for the verticalAlign style. |
| STYLE_GLASS | Defines the key for the glass style. |
| STYLE_IMAGE | Defines the key for the image style. |
| STYLE_IMAGE_WIDTH | Defines the key for the imageWidth style. |
| STYLE_IMAGE_HEIGHT | Defines the key for the imageHeight style. |
| STYLE_IMAGE_BACKGROUND | Defines the key for the image background color. |
| STYLE_IMAGE_BORDER | Defines the key for the image border color. |
| STYLE_FLIPH | Defines the key for the horizontal image flip. |
| STYLE_FLIPV | Defines the key for the vertical flip. |
| STYLE_NOLABEL | Defines the key for the noLabel style. |
| STYLE_NOEDGESTYLE | Defines the key for the noEdgeStyle style. |
| STYLE_LABEL_BACKGROUNDCOLOR | Defines the key for the label background color. |
| STYLE_LABEL_BORDERCOLOR | Defines the key for the label border color. |
| STYLE_LABEL_PADDING | Defines the key for the label padding, ie. |
| STYLE_INDICATOR_SHAPE | Defines the key for the indicator shape used within an mxLabel. |
| STYLE_INDICATOR_IMAGE | Defines the key for the indicator image used within an mxLabel. |
| STYLE_INDICATOR_COLOR | Defines the key for the indicatorColor style. |
| STYLE_INDICATOR_STROKECOLOR | Defines the key for the indicator stroke color in mxLabel. |
| STYLE_INDICATOR_GRADIENTCOLOR | Defines the key for the indicatorGradientColor style. |
| STYLE_INDICATOR_SPACING | The defines the key for the spacing between the label and the indicator in mxLabel. |
| STYLE_INDICATOR_WIDTH | Defines the key for the indicator width. |
| STYLE_INDICATOR_HEIGHT | Defines the key for the indicator height. |
| STYLE_INDICATOR_DIRECTION | Defines the key for the indicatorDirection style. |
| STYLE_SHADOW | Defines the key for the shadow style. |
| STYLE_SEGMENT | Defines the key for the segment style. |
| STYLE_ENDARROW | Defines the key for the end arrow marker. |
| STYLE_STARTARROW | Defines the key for the start arrow marker. |
| STYLE_ENDSIZE | Defines the key for the endSize style. |
| STYLE_STARTSIZE | Defines the key for the startSize style. |
| STYLE_SWIMLANE_LINE | Defines the key for the swimlaneLine style. |
| STYLE_ENDFILL | Defines the key for the endFill style. |
| STYLE_STARTFILL | Defines the key for the startFill style. |
| STYLE_DASHED | Defines the key for the dashed style. |
| STYLE_FIX_DASH | Defines the key for the fixDash style. |
| STYLE_ROUNDED | Defines the key for the rounded style. |
| STYLE_CURVED | Defines the key for the curved style. |
| STYLE_ARCSIZE | Defines the rounding factor for a rounded rectangle in percent (without the percent sign). |
| STYLE_ABSOLUTE_ARCSIZE | Defines the key for the absolute arc size style. |
| STYLE_SOURCE_PERIMETER_SPACING | Defines the key for the source perimeter spacing. |
| STYLE_TARGET_PERIMETER_SPACING | Defines the key for the target perimeter spacing. |
| STYLE_PERIMETER_SPACING | Defines the key for the perimeter spacing. |
| STYLE_SPACING | Defines the key for the spacing. |
| STYLE_SPACING_TOP | Defines the key for the spacingTop style. |
| STYLE_SPACING_LEFT | Defines the key for the spacingLeft style. |
| STYLE_SPACING_BOTTOM | Defines the key for the spacingBottom style The value represents the spacing, in pixels, added to the bottom side of a label in a vertex (style applies to vertices only). |
| STYLE_SPACING_RIGHT | Defines the key for the spacingRight style The value represents the spacing, in pixels, added to the right side of a label in a vertex (style applies to vertices only). |
| STYLE_HORIZONTAL | Defines the key for the horizontal style. |
| STYLE_DIRECTION | Defines the key for the direction style. |
| STYLE_ANCHOR_POINT_DIRECTION | Defines the key for the anchorPointDirection style. |
| STYLE_ELBOW | Defines the key for the elbow style. |
| STYLE_FONTCOLOR | Defines the key for the fontColor style. |
| STYLE_FONTFAMILY | Defines the key for the fontFamily style. |
| STYLE_FONTSIZE | Defines the key for the fontSize style (in px). |
| STYLE_FONTSTYLE | Defines the key for the fontStyle style. |
| STYLE_ASPECT | Defines the key for the aspect style. |
| STYLE_AUTOSIZE | Defines the key for the autosize style. |
| STYLE_FOLDABLE | Defines the key for the foldable style. |
| STYLE_EDITABLE | Defines the key for the editable style. |
| STYLE_BACKGROUND_OUTLINE | Defines the key for the backgroundOutline style. |
| STYLE_BENDABLE | Defines the key for the bendable style. |
| STYLE_MOVABLE | Defines the key for the movable style. |
| STYLE_RESIZABLE | Defines the key for the resizable style. |
| STYLE_RESIZE_WIDTH | Defines the key for the resizeWidth style. |
| STYLE_RESIZE_WIDTH | Defines the key for the resizeHeight style. |
| STYLE_ROTATABLE | Defines the key for the rotatable style. |
| STYLE_CLONEABLE | Defines the key for the cloneable style. |
| STYLE_DELETABLE | Defines the key for the deletable style. |
| STYLE_SHAPE | Defines the key for the shape. |
| STYLE_EDGE | Defines the key for the edge style. |
| STYLE_JETTY_SIZE | Defines the key for the jetty size in mxEdgeStyle.OrthConnector. |
| STYLE_SOURCE_JETTY_SIZE | Defines the key for the jetty size in mxEdgeStyle.OrthConnector. |
| targetJettySize | Defines the key for the jetty size in mxEdgeStyle.OrthConnector. |
| STYLE_LOOP | Defines the key for the loop style. |
| STYLE_ORTHOGONAL_LOOP | Defines the key for the orthogonal loop style. |
| STYLE_ROUTING_CENTER_X | Defines the key for the horizontal routing center. |
| STYLE_ROUTING_CENTER_Y | Defines the key for the vertical routing center. |
| FONT_BOLD | Constant for bold fonts. |
| FONT_ITALIC | Constant for italic fonts. |
| FONT_UNDERLINE | Constant for underlined fonts. |
| SHAPE_RECTANGLE | Name under which mxRectangleShape is registered in mxCellRenderer. |
| SHAPE_ELLIPSE | Name under which mxEllipse is registered in mxCellRenderer. |
| SHAPE_DOUBLE_ELLIPSE | Name under which mxDoubleEllipse is registered in mxCellRenderer. |
| SHAPE_RHOMBUS | Name under which mxRhombus is registered in mxCellRenderer. |
| SHAPE_LINE | Name under which mxLine is registered in mxCellRenderer. |
| SHAPE_IMAGE | Name under which mxImageShape is registered in mxCellRenderer. |
| SHAPE_ARROW | Name under which mxArrow is registered in mxCellRenderer. |
| SHAPE_ARROW_CONNECTOR | Name under which mxArrowConnector is registered in mxCellRenderer. |
| SHAPE_LABEL | Name under which mxLabel is registered in mxCellRenderer. |
| SHAPE_CYLINDER | Name under which mxCylinder is registered in mxCellRenderer. |
| SHAPE_SWIMLANE | Name under which mxSwimlane is registered in mxCellRenderer. |
| SHAPE_CONNECTOR | Name under which mxConnector is registered in mxCellRenderer. |
| SHAPE_ACTOR | Name under which mxActor is registered in mxCellRenderer. |
| SHAPE_CLOUD | Name under which mxCloud is registered in mxCellRenderer. |
| SHAPE_TRIANGLE | Name under which mxTriangle is registered in mxCellRenderer. |
| SHAPE_HEXAGON | Name under which mxHexagon is registered in mxCellRenderer. |
| ARROW_CLASSIC | Constant for classic arrow markers. |
| ARROW_CLASSIC_THIN | Constant for thin classic arrow markers. |
| ARROW_BLOCK | Constant for block arrow markers. |
| ARROW_BLOCK_THIN | Constant for thin block arrow markers. |
| ARROW_OPEN | Constant for open arrow markers. |
| ARROW_OPEN_THIN | Constant for thin open arrow markers. |
| ARROW_OVAL | Constant for oval arrow markers. |
| ARROW_DIAMOND | Constant for diamond arrow markers. |
| ARROW_DIAMOND_THIN | Constant for thin diamond arrow markers. |
| ALIGN_LEFT | Constant for left horizontal alignment. |
| ALIGN_CENTER | Constant for center horizontal alignment. |
| ALIGN_RIGHT | Constant for right horizontal alignment. |
| ALIGN_TOP | Constant for top vertical alignment. |
| ALIGN_MIDDLE | Constant for middle vertical alignment. |
| ALIGN_BOTTOM | Constant for bottom vertical alignment. |
| DIRECTION_NORTH | Constant for direction north. |
| DIRECTION_SOUTH | Constant for direction south. |
| DIRECTION_EAST | Constant for direction east. |
| DIRECTION_WEST | Constant for direction west. |
| TEXT_DIRECTION_DEFAULT | Constant for text direction default. |
| TEXT_DIRECTION_AUTO | Constant for text direction automatic. |
| TEXT_DIRECTION_LTR | Constant for text direction left to right. |
| TEXT_DIRECTION_RTL | Constant for text direction right to left. |
| DIRECTION_MASK_NONE | Constant for no direction. |
| DIRECTION_MASK_WEST | Bitwise mask for west direction. |
| DIRECTION_MASK_NORTH | Bitwise mask for north direction. |
| DIRECTION_MASK_SOUTH | Bitwise mask for south direction. |
| DIRECTION_MASK_EAST | Bitwise mask for east direction. |
| DIRECTION_MASK_ALL | Bitwise mask for all directions. |
| ELBOW_VERTICAL | Constant for elbow vertical. |
| ELBOW_HORIZONTAL | Constant for elbow horizontal. |
| EDGESTYLE_ELBOW | Name of the elbow edge style. |
| EDGESTYLE_ENTITY_RELATION | Name of the entity relation edge style. |
| EDGESTYLE_LOOP | Name of the loop edge style. |
| EDGESTYLE_SIDETOSIDE | Name of the side to side edge style. |
| EDGESTYLE_TOPTOBOTTOM | Name of the top to bottom edge style. |
| EDGESTYLE_ORTHOGONAL | Name of the generic orthogonal edge style. |
| EDGESTYLE_SEGMENT | Name of the generic segment edge style. |
| PERIMETER_ELLIPSE | Name of the ellipse perimeter. |
| PERIMETER_RECTANGLE | Name of the rectangle perimeter. |
| PERIMETER_RHOMBUS | Name of the rhombus perimeter. |
| PERIMETER_HEXAGON | Name of the hexagon perimeter. |
| PERIMETER_TRIANGLE | Name of the triangle perimeter. |
Specifies the default highlight color for shape outlines. Default is #0000FF. This is used in mxEdgeHandler.
Defines the strokewidth to be used for shape outlines. Default is 5. This is used in mxEdgeHandler.
Defines the default value for the STYLE_TEXT_DIRECTION if no value is defined for it in the style. Default value is an empty string which means the default system setting is used and no direction is set.
Defines the length of the horizontal segment of an Entity Relation. This can be overridden using mxConstants.STYLE_SEGMENT style. Default is 30.
Defines the key for the perimeter style. This is a function that defines the perimeter around a particular shape. Possible values are the functions defined in mxPerimeter. Alternatively, the constants in this class that start with “PERIMETER_” may be used to access perimeter styles in mxStyleRegistry. Value is “perimeter”.
Defines the key for the text direction style. Possible values are “TEXT_DIRECTION_DEFAULT, TEXT_DIRECTION_AUTO, TEXT_DIRECTION_LTR” and “TEXT_DIRECTION_RTL”. Value is “textDirection”. The default value for the style is defined in DEFAULT_TEXT_DIRECTION. It is used is no value is defined for this key in a given style. This is an experimental style that is currently ignored in the backends.
Defines the key for the overflow style. Possible values are ‘visible’, ‘hidden’, ‘fill’ and ‘width’. The default value is ‘visible’. This value specifies how overlapping vertex labels are handled. A value of ‘visible’ will show the complete label. A value of ‘hidden’ will clip the label so that it does not overlap the vertex bounds. A value of ‘fill’ will use the vertex bounds and a value of ‘width’ will use the the vertex width for the label. See mxGraph.isLabelClipped. Note that the vertical alignment is ignored for overflow fill and for horizontal alignment, left should be used to avoid pixel offsets in Internet Explorer 11 and earlier or if foreignObjects are disabled. Value is “overflow”.
Defines if the connection points on either end of the edge should be computed so that the edge is vertical or horizontal if possible and if the point is not at a fixed location. Default is false. This is used in mxGraph.isOrthogonal, which also returns true if the edgeStyle of the edge is an elbow or entity. Value is “orthogonal”.
Defines the key for the white-space style. Possible values are ‘nowrap’ and ‘wrap’. The default value is ‘nowrap’. This value specifies how white-space inside a HTML vertex label should be handled. A value of ‘nowrap’ means the text will never wrap to the next line until a linefeed is encountered. A value of ‘wrap’ means text will wrap when necessary. This style is only used for HTML labels. See mxGraph.isWrapping. Value is “whiteSpace”.
Specifies if pointer events should be fired on transparent backgrounds. This style is currently only supported in mxRectangleShape. Default is true. Value is “pointerEvents”. This is typically set to false in groups where the transparent part should allow any underlying cells to be clickable.
Defines the key for the gradient color. Possible values are all HTML color names or HEX codes, as well as special keywords such as ‘swimlane, ‘inherit’ or ‘indicated’ to use the color code of a related cell or the indicator shape. This is ignored if no fill color is defined. Value is “gradientColor”.
Defines the key for the gradient direction. Possible values are DIRECTION_EAST, DIRECTION_WEST, DIRECTION_NORTH and DIRECTION_SOUTH. Default is DIRECTION_SOUTH. Generally, and by default in mxGraph, gradient painting is done from the value of STYLE_FILLCOLOR to the value of STYLE_GRADIENTCOLOR. Taking the example of DIRECTION_NORTH, this means STYLE_FILLCOLOR color at the bottom of paint pattern and STYLE_GRADIENTCOLOR at top, with a gradient in-between. Value is “gradientDirection”.
Defines the key for the separatorColor style. Possible values are all HTML color names or HEX codes. This style is only used for SHAPE_SWIMLANE shapes. Value is “separatorColor”.
Defines the key for the align style. Possible values are ALIGN_LEFT, ALIGN_CENTER and ALIGN_RIGHT. This value defines how the lines of the label are horizontally aligned. ALIGN_LEFT mean label text lines are aligned to left of the label bounds, ALIGN_RIGHT to the right of the label bounds and ALIGN_CENTER means the center of the text lines are aligned in the center of the label bounds. Note this value doesn’t affect the positioning of the overall label bounds relative to the vertex, to move the label bounds horizontally, use STYLE_LABEL_POSITION. Value is “align”.
Defines the key for the verticalAlign style. Possible values are ALIGN_TOP, ALIGN_MIDDLE and ALIGN_BOTTOM. This value defines how the lines of the label are vertically aligned. ALIGN_TOP means the topmost label text line is aligned against the top of the label bounds, ALIGN_BOTTOM means the bottom-most label text line is aligned against the bottom of the label bounds and ALIGN_MIDDLE means there is equal spacing between the topmost text label line and the top of the label bounds and the bottom-most text label line and the bottom of the label bounds. Note this value doesn’t affect the positioning of the overall label bounds relative to the vertex, to move the label bounds vertically, use STYLE_VERTICAL_LABEL_POSITION. Value is “verticalAlign”.
Defines the key for the horizontal label position of vertices. Possible values are ALIGN_LEFT, ALIGN_CENTER and ALIGN_RIGHT. Default is ALIGN_CENTER. The label align defines the position of the label relative to the cell. ALIGN_LEFT means the entire label bounds is placed completely just to the left of the vertex, ALIGN_RIGHT means adjust to the right and ALIGN_CENTER means the label bounds are vertically aligned with the bounds of the vertex. Note this value doesn’t affect the positioning of label within the label bounds, to move the label horizontally within the label bounds, use STYLE_ALIGN. Value is “labelPosition”.
Defines the key for the vertical label position of vertices. Possible values are ALIGN_TOP, ALIGN_BOTTOM and ALIGN_MIDDLE. Default is ALIGN_MIDDLE. The label align defines the position of the label relative to the cell. ALIGN_TOP means the entire label bounds is placed completely just on the top of the vertex, ALIGN_BOTTOM means adjust on the bottom and ALIGN_MIDDLE means the label bounds are horizontally aligned with the bounds of the vertex. Note this value doesn’t affect the positioning of label within the label bounds, to move the label vertically within the label bounds, use STYLE_VERTICAL_ALIGN. Value is “verticalLabelPosition”.
Defines the key for the image aspect style. Possible values are 0 (do not preserve aspect) or 1 (keep aspect). This is only used in mxImageShape. Default is 1. Value is “imageAspect”.
Defines the key for the align style. Possible values are ALIGN_LEFT, ALIGN_CENTER and ALIGN_RIGHT. The value defines how any image in the vertex label is aligned horizontally within the label bounds of a SHAPE_LABEL shape. Value is “imageAlign”.
Defines the key for the verticalAlign style. Possible values are ALIGN_TOP, ALIGN_MIDDLE and ALIGN_BOTTOM. The value defines how any image in the vertex label is aligned vertically within the label bounds of a SHAPE_LABEL shape. Value is “imageVerticalAlign”.
Defines the key for the glass style. Possible values are 0 (disabled) and 1(enabled). The default value is 0. This is used in mxLabel. Value is “glass”.
Defines the key for the image style. Possible values are any image URL, the type of the value is String. This is the path to the image that is to be displayed within the label of a vertex. Data URLs should use the following format: data:image/png,xyz where xyz is the base64 encoded data (without the “base64”-prefix). Note that Data URLs are only supported in modern browsers. Value is “image”.
Defines the key for the image background color. This style is only used in mxImageShape. Possible values are all HTML color names or HEX codes. Value is “imageBackground”.
Defines the key for the image border color. This style is only used in mxImageShape. Possible values are all HTML color names or HEX codes. Value is “imageBorder”.
Defines the key for the horizontal image flip. This style is only used in mxImageShape. Possible values are 0 and 1. Default is 0. Value is “flipH”.
Defines the key for the indicator shape used within an mxLabel. Possible values are all SHAPE_* constants or the names of any new shapes. The indicatorShape has precedence over the indicatorImage. Value is “indicatorShape”.
Defines the key for the indicator image used within an mxLabel. Possible values are all image URLs. The indicatorShape has precedence over the indicatorImage. Value is “indicatorImage”.
Defines the key for the indicator stroke color in mxLabel. Possible values are all color codes. Value is “indicatorStrokeColor”.
Defines the key for the indicatorGradientColor style. Possible values are all HTML color names or HEX codes. This style is only supported in SHAPE_LABEL shapes. Value is “indicatorGradientColor”.
The defines the key for the spacing between the label and the indicator in mxLabel. Possible values are in pixels. Value is “indicatorSpacing”.
Defines the key for the indicatorDirection style. The direction style is used to specify the direction of certain shapes (eg. mxTriangle). Possible values are DIRECTION_EAST (default), DIRECTION_WEST, DIRECTION_NORTH and DIRECTION_SOUTH. Value is “indicatorDirection”.
Defines the key for the end arrow marker. Possible values are all constants with an ARROW-prefix. This is only used in mxConnector. Value is “endArrow”.
style[mxConstants.STYLE_ENDARROW] = mxConstants.ARROW_CLASSIC;
Defines the key for the start arrow marker. Possible values are all constants with an ARROW-prefix. This is only used in mxConnector. See STYLE_ENDARROW. Value is “startArrow”.
Defines the key for the endFill style. Use 0 for no fill or 1 (default) for fill. (This style is only exported via mxImageExport.) Value is “endFill”.
Defines the key for the startFill style. Use 0 for no fill or 1 (default) for fill. (This style is only exported via mxImageExport.) Value is “startFill”.
Defines the key for the rounded style. The type of this value is Boolean. For edges this determines whether or not joins between edges segments are smoothed to a rounded finish. For vertices that have the rectangle shape, this determines whether or not the rectangle is rounded. Use 0 (default) for non-rounded or 1 for rounded. Value is “rounded”.
Defines the rounding factor for a rounded rectangle in percent (without the percent sign). Possible values are between 0 and 100. If this value is not specified then RECTANGLE_ROUNDING_FACTOR * 100 is used. For edges, this defines the absolute size of rounded corners in pixels. If this values is not specified then LINE_ARCSIZE is used. (This style is only exported via mxImageExport.) Value is “arcSize”.
Defines the key for the source perimeter spacing. The type of this value is numeric. This is the distance between the source connection point of an edge and the perimeter of the source vertex in pixels. This style only applies to edges. Value is “sourcePerimeterSpacing”.
Defines the key for the target perimeter spacing. The type of this value is numeric. This is the distance between the target connection point of an edge and the perimeter of the target vertex in pixels. This style only applies to edges. Value is “targetPerimeterSpacing”.
Defines the key for the perimeter spacing. This is the distance between the connection point and the perimeter in pixels. When used in a vertex style, this applies to all incoming edges to floating ports (edges that terminate on the perimeter of the vertex). When used in an edge style, this spacing applies to the source and target separately, if they terminate in floating ports (on the perimeter of the vertex). Value is “perimeterSpacing”.
Defines the key for the horizontal style. Possible values are true or false. This value only applies to vertices. If the STYLE_SHAPE is “SHAPE_SWIMLANE” a value of false indicates that the swimlane should be drawn vertically, true indicates to draw it horizontally. If the shape style does not indicate that this vertex is a swimlane, this value affects only whether the label is drawn horizontally or vertically. Value is “horizontal”.
Defines the key for the direction style. The direction style is used to specify the direction of certain shapes (eg. mxTriangle). Possible values are DIRECTION_EAST (default), DIRECTION_WEST, DIRECTION_NORTH and DIRECTION_SOUTH. Value is “direction”.
Defines the key for the anchorPointDirection style. The defines if the direction style should be taken into account when computing the fixed point location for connected edges. Default is 1 (yes). Set this to 0 to ignore the direction style for fixed connection points. Value is “anchorPointDirection”.
Defines the key for the elbow style. Possible values are ELBOW_HORIZONTAL and ELBOW_VERTICAL. Default is ELBOW_HORIZONTAL. This defines how the three segment orthogonal edge style leaves its terminal vertices. The vertical style leaves the terminal vertices at the top and bottom sides. Value is “elbow”.
Defines the key for the fontStyle style. Values may be any logical AND (sum) of FONT_BOLD, FONT_ITALIC and FONT_UNDERLINE. The type of the value is int. Value is “fontStyle”.
Defines the key for the autosize style. This specifies if a cell should be resized automatically if the value has changed. Possible values are 0 or 1. Default is 0. See mxGraph.isAutoSizeCell. This is normally combined with STYLE_RESIZABLE to disable manual sizing. Value is “autosize”.
Defines the key for the foldable style. This specifies if a cell is foldable using a folding icon. Possible values are 0 or 1. Default is 1. See mxGraph.isCellFoldable. Value is “foldable”.
Defines the key for the editable style. This specifies if the value of a cell can be edited using the in-place editor. Possible values are 0 or 1. Default is 1. See mxGraph.isCellEditable. Value is “editable”.
Defines the key for the bendable style. This specifies if the control points of an edge can be moved. Possible values are 0 or 1. Default is 1. See mxGraph.isCellBendable. Value is “bendable”.
Defines the key for the movable style. This specifies if a cell can be moved. Possible values are 0 or 1. Default is 1. See mxGraph.isCellMovable. Value is “movable”.
Defines the key for the resizable style. This specifies if a cell can be resized. Possible values are 0 or 1. Default is 1. See mxGraph.isCellResizable. Value is “resizable”.
Defines the key for the resizeWidth style. This specifies if a cell’s width is resized if the parent is resized. If this is 1 then the width will be resized even if the cell’s geometry is relative. If this is 0 then the cell’s width will not be resized. Default is not defined. Value is “resizeWidth”.
Defines the key for the resizeHeight style. This specifies if a cell’s height if resize if the parent is resized. If this is 1 then the height will be resized even if the cell’s geometry is relative. If this is 0 then the cell’s height will not be resized. Default is not defined. Value is “resizeHeight”.
Defines the key for the rotatable style. This specifies if a cell can be rotated. Possible values are 0 or 1. Default is 1. See mxGraph.isCellRotatable. Value is “rotatable”.
Defines the key for the cloneable style. This specifies if a cell can be cloned. Possible values are 0 or 1. Default is 1. See mxGraph.isCellCloneable. Value is “cloneable”.
Defines the key for the deletable style. This specifies if a cell can be deleted. Possible values are 0 or 1. Default is 1. See mxGraph.isCellDeletable. Value is “deletable”.
Defines the key for the edge style. Possible values are the functions defined in mxEdgeStyle. Value is “edgeStyle”.
Defines the key for the jetty size in mxEdgeStyle.OrthConnector. Default is 10. Possible values are all numeric values or “auto”. Jetty size is the minimum length of the orthogonal segment before it attaches to a shape. Value is “jettySize”.
Defines the key for the jetty size in mxEdgeStyle.OrthConnector. Default is 10. Possible values are numeric values or “auto”. This has precedence over STYLE_JETTY_SIZE. Value is “sourceJettySize”.
Defines the key for the jetty size in mxEdgeStyle.OrthConnector. Default is 10. Possible values are numeric values or “auto”. This has precedence over STYLE_JETTY_SIZE. Value is “targetJettySize”.
Defines the key for the loop style. Possible values are the functions defined in mxEdgeStyle. Value is “loopStyle”. Default is <mxGraph.defaultLoopStylean>.
Defines the key for the orthogonal loop style. Possible values are 0 and 1. Default is 0. Value is “orthogonalLoop”. Use this style to specify if loops with no waypoints and defined anchor points should be routed using STYLE_LOOP or not routed.
Name under which mxRectangleShape is registered in mxCellRenderer. Default is rectangle.
Name under which mxEllipse is registered in mxCellRenderer. Default is ellipse.
Name under which mxDoubleEllipse is registered in mxCellRenderer. Default is doubleEllipse.
Name under which mxRhombus is registered in mxCellRenderer. Default is rhombus.
Name under which mxLine is registered in mxCellRenderer. Default is line.
Name under which mxImageShape is registered in mxCellRenderer. Default is image.
Name under which mxArrow is registered in mxCellRenderer. Default is arrow.
Name under which mxArrowConnector is registered in mxCellRenderer. Default is arrowConnector.
Name under which mxLabel is registered in mxCellRenderer. Default is label.
Name under which mxCylinder is registered in mxCellRenderer. Default is cylinder.
Name under which mxSwimlane is registered in mxCellRenderer. Default is swimlane.
Name under which mxConnector is registered in mxCellRenderer. Default is connector.
Name under which mxActor is registered in mxCellRenderer. Default is actor.
Name under which mxCloud is registered in mxCellRenderer. Default is cloud.
Name under which mxTriangle is registered in mxCellRenderer. Default is triangle.
Name under which mxHexagon is registered in mxCellRenderer. Default is hexagon.
Constant for text direction automatic. Default is auto. Use this value to find the direction for a given text with mxText.getAutoDirection.
The mxEventObject is a wrapper for all properties of a single event. Additionally, it also offers functions to consume the event and check if it was consumed as follows:
evt.consume(); INV: evt.isConsumed() == true
| Functions | |
| mxEventObject | Constructs a new event object with the specified name. |
| Variables | |
| name | Holds the name. |
| properties | Holds the properties as an associative array. |
| consumed | Holds the consumed state. |
| Functions | |
| getName | Returns name. |
| getProperties | Returns properties. |
| getProperty | Returns the property for the given key. |
| isConsumed | Returns true if the event has been consumed. |
| consume | Consumes the event. |
mxEventObject.prototype.getName = function()
Returns name.
mxEventObject.prototype.getProperties = function()
Returns properties.
Base class for all mouse events in mxGraph. A listener for this event should implement the following methods:
graph.addMouseListener(
{
mouseDown: function(sender, evt)
{
mxLog.debug('mouseDown');
},
mouseMove: function(sender, evt)
{
mxLog.debug('mouseMove');
},
mouseUp: function(sender, evt)
{
mxLog.debug('mouseUp');
}
});| Functions | |
| mxMouseEvent | Constructs a new event object for the given arguments. |
| Variables | |
| consumed | Holds the consumed state of this event. |
| evt | Holds the inner event object. |
| graphX | Holds the x-coordinate of the event in the graph. |
| graphY | Holds the y-coordinate of the event in the graph. |
| state | Holds the optional mxCellState associated with this event. |
| sourceState | Holds the mxCellState that was passed to the constructor. |
| Functions | |
| getEvent | Returns evt. |
| getSource | Returns the target DOM element using mxEvent.getSource for evt. |
| isSource | Returns true if the given mxShape is the source of evt. |
| getX | Returns <evt.clientX>. |
| getY | Returns <evt.clientY>. |
| getGraphX | Returns graphX. |
| getGraphY | Returns graphY. |
| getState | Returns state. |
| getCell | Returns the mxCell in state is not null. |
| isPopupTrigger | Returns true if the event is a popup trigger. |
| isConsumed | Returns consumed. |
| consume | Sets consumed to true and invokes preventDefault on the native event if such a method is defined. |
function mxMouseEvent( evt, state )
Constructs a new event object for the given arguments.
| evt | Native mouse event. |
| state | Optional mxCellState under the mouse. |
mxMouseEvent.prototype.graphX
Holds the x-coordinate of the event in the graph. This value is set in mxGraph.fireMouseEvent.
mxMouseEvent.prototype.graphY
Holds the y-coordinate of the event in the graph. This value is set in mxGraph.fireMouseEvent.
mxMouseEvent.prototype.state
Holds the optional mxCellState associated with this event.
mxMouseEvent.prototype.sourceState
Holds the mxCellState that was passed to the constructor. This can be different from state depending on the result of mxGraph.getEventState.
mxMouseEvent.prototype.getEvent = function()
Returns evt.
mxMouseEvent.prototype.getSource = function()
Returns the target DOM element using mxEvent.getSource for evt.
mxMouseEvent.prototype.getGraphX = function()
Returns graphX.
mxMouseEvent.prototype.getGraphY = function()
Returns graphY.
mxMouseEvent.prototype.getState = function()
Returns state.
mxMouseEvent.prototype.isConsumed = function()
Returns consumed.
mxMouseEvent.prototype.consume = function( preventDefault )
Sets consumed to true and invokes preventDefault on the native event if such a method is defined. This is used mainly to avoid the cursor from being changed to a text cursor in Webkit. You can use the preventDefault flag to disable this functionality.
| preventDefault | Specifies if the native event should be canceled. Default is true. |
Base class for objects that dispatch named events. To create a subclass that inherits from mxEventSource, the following code is used.
function MyClass() { };
MyClass.prototype = new mxEventSource();
MyClass.prototype.constructor = MyClass;mxGraphModel, mxGraph, mxGraphView, mxEditor, mxCellOverlay, mxToolbar, mxWindow
| Functions | |
| mxEventSource | Constructs a new event source. |
| Variables | |
| eventListeners | Holds the event names and associated listeners in an array. |
| eventsEnabled | Specifies if events can be fired. |
| eventSource | Optional source for events. |
| Functions | |
| isEventsEnabled | Returns eventsEnabled. |
| setEventsEnabled | Sets eventsEnabled. |
| getEventSource | Returns eventSource. |
| setEventSource | Sets eventSource. |
| addListener | Binds the specified function to the given event name. |
| removeListener | Removes all occurrences of the given listener from eventListeners. |
| fireEvent | Dispatches the given event to the listeners which are registered for the event. |
mxEventSource.prototype.isEventsEnabled = function()
Returns eventsEnabled.
mxEventSource.prototype.setEventsEnabled = function( value )
Sets eventsEnabled.
mxEventSource.prototype.getEventSource = function()
Returns eventSource.
mxEventSource.prototype.setEventSource = function( value )
Sets eventSource.
mxEventSource.prototype.addListener = function( name, funct )
Binds the specified function to the given event name. If no event name is given, then the listener is registered for all events.
The parameters of the listener are the sender and an mxEventObject.
mxEventSource.prototype.removeListener = function( funct )
Removes all occurrences of the given listener from eventListeners.
mxEventSource.prototype.fireEvent = function( evt, sender )
Dispatches the given event to the listeners which are registered for the event. The sender argument is optional. The current execution scope (“this”) is used for the listener invocation (see mxUtils.bind).
fireEvent(new mxEventObject("eventName", key1, val1, .., keyN, valN))| evt | mxEventObject that represents the event. |
| sender | Optional sender to be passed to the listener. Default value is the return value of getEventSource. |
Cross-browser DOM event support. For internal event handling, mxEventSource and the graph event dispatch loop in mxGraph are used.
Use this class for adding and removing listeners to/from DOM nodes. The removeAllListeners function is provided to remove all listeners that have been added using addListener. The function should be invoked when the last reference is removed in the JavaScript code, typically when the referenced DOM node is removed from the DOM.
| Functions | |
| addListener | Binds the function to the specified event on the given element. |
| removeListener | Removes the specified listener from the given element. |
| removeAllListeners | Removes all listeners from the given element. |
| addGestureListeners | Adds the given listeners for touch, mouse and/or pointer events. |
| removeGestureListeners | Removes the given listeners from mousedown, mousemove, mouseup and the respective touch events if mxClient.IS_TOUCH is true. |
| redirectMouseEvents | Redirects the mouse events from the given DOM node to the graph dispatch loop using the event and given state as event arguments. |
| release | Removes the known listeners from the given DOM node and its descendants. |
| disableContextMenu | Disables the context menu for the given element. |
| getSource | Returns the event’s target or srcElement depending on the browser. |
| isConsumed | Returns true if the event has been consumed using consume. |
| isTouchEvent | Returns true if the event was generated using a touch device (not a pen or mouse). |
| isPenEvent | Returns true if the event was generated using a pen (not a touch device or mouse). |
| isMultiTouchEvent | Returns true if the event was generated using a touch device (not a pen or mouse). |
| isMouseEvent | Returns true if the event was generated using a mouse (not a pen or touch device). |
| isLeftMouseButton | Returns true if the left mouse button is pressed for the given event. |
| isMiddleMouseButton | Returns true if the middle mouse button is pressed for the given event. |
| isRightMouseButton | Returns true if the right mouse button was pressed. |
| isPopupTrigger | Returns true if the event is a popup trigger. |
| isShiftDown | Returns true if the shift key is pressed for the given event. |
| isAltDown | Returns true if the alt key is pressed for the given event. |
| isControlDown | Returns true if the control key is pressed for the given event. |
| isMetaDown | Returns true if the meta key is pressed for the given event. |
| getMainEvent | Returns the touch or mouse event that contains the mouse coordinates. |
| getClientX | Returns true if the meta key is pressed for the given event. |
| getClientY | Returns true if the meta key is pressed for the given event. |
| consume | Consumes the given event. |
| Variables | |
| LABEL_HANDLE | Index for the label handle in an mxMouseEvent. |
| ROTATION_HANDLE | Index for the rotation handle in an mxMouseEvent. |
| CUSTOM_HANDLE | Start index for the custom handles in an mxMouseEvent. |
| VIRTUAL_HANDLE | Start index for the virtual handles in an mxMouseEvent. |
| MOUSE_DOWN | Specifies the event name for mouseDown. |
| MOUSE_MOVE | Specifies the event name for mouseMove. |
| MOUSE_UP | Specifies the event name for mouseUp. |
| ACTIVATE | Specifies the event name for activate. |
| RESIZE_START | Specifies the event name for resizeStart. |
| RESIZE | Specifies the event name for resize. |
| RESIZE_END | Specifies the event name for resizeEnd. |
| MOVE_START | Specifies the event name for moveStart. |
| MOVE | Specifies the event name for move. |
| MOVE_END | Specifies the event name for moveEnd. |
| PAN_START | Specifies the event name for panStart. |
| PAN | Specifies the event name for pan. |
| PAN_END | Specifies the event name for panEnd. |
| MINIMIZE | Specifies the event name for minimize. |
| NORMALIZE | Specifies the event name for normalize. |
| MAXIMIZE | Specifies the event name for maximize. |
| HIDE | Specifies the event name for hide. |
| SHOW | Specifies the event name for show. |
| CLOSE | Specifies the event name for close. |
| DESTROY | Specifies the event name for destroy. |
| REFRESH | Specifies the event name for refresh. |
| SIZE | Specifies the event name for size. |
| SELECT | Specifies the event name for select. |
| FIRED | Specifies the event name for fired. |
| FIRE_MOUSE_EVENT | Specifies the event name for fireMouseEvent. |
| GESTURE | Specifies the event name for gesture. |
| TAP_AND_HOLD | Specifies the event name for tapAndHold. |
| GET | Specifies the event name for get. |
| RECEIVE | Specifies the event name for receive. |
| CONNECT | Specifies the event name for connect. |
| DISCONNECT | Specifies the event name for disconnect. |
| SUSPEND | Specifies the event name for suspend. |
| RESUME | Specifies the event name for suspend. |
| MARK | Specifies the event name for mark. |
| ROOT | Specifies the event name for root. |
| POST | Specifies the event name for post. |
| OPEN | Specifies the event name for open. |
| SAVE | Specifies the event name for open. |
| BEFORE_ADD_VERTEX | Specifies the event name for beforeAddVertex. |
| ADD_VERTEX | Specifies the event name for addVertex. |
| AFTER_ADD_VERTEX | Specifies the event name for afterAddVertex. |
| DONE | Specifies the event name for done. |
| EXECUTE | Specifies the event name for execute. |
| EXECUTED | Specifies the event name for executed. |
| BEGIN_UPDATE | Specifies the event name for beginUpdate. |
| START_EDIT | Specifies the event name for startEdit. |
| END_UPDATE | Specifies the event name for endUpdate. |
| END_EDIT | Specifies the event name for endEdit. |
| BEFORE_UNDO | Specifies the event name for beforeUndo. |
| UNDO | Specifies the event name for undo. |
| REDO | Specifies the event name for redo. |
| CHANGE | Specifies the event name for change. |
| NOTIFY | Specifies the event name for notify. |
| LAYOUT_CELLS | Specifies the event name for layoutCells. |
| CLICK | Specifies the event name for click. |
| SCALE | Specifies the event name for scale. |
| TRANSLATE | Specifies the event name for translate. |
| SCALE_AND_TRANSLATE | Specifies the event name for scaleAndTranslate. |
| UP | Specifies the event name for up. |
| DOWN | Specifies the event name for down. |
| ADD | Specifies the event name for add. |
| REMOVE | Specifies the event name for remove. |
| CLEAR | Specifies the event name for clear. |
| ADD_CELLS | Specifies the event name for addCells. |
| CELLS_ADDED | Specifies the event name for cellsAdded. |
| MOVE_CELLS | Specifies the event name for moveCells. |
| CELLS_MOVED | Specifies the event name for cellsMoved. |
| RESIZE_CELLS | Specifies the event name for resizeCells. |
| CELLS_RESIZED | Specifies the event name for cellsResized. |
| TOGGLE_CELLS | Specifies the event name for toggleCells. |
| CELLS_TOGGLED | Specifies the event name for cellsToggled. |
| ORDER_CELLS | Specifies the event name for orderCells. |
| CELLS_ORDERED | Specifies the event name for cellsOrdered. |
| REMOVE_CELLS | Specifies the event name for removeCells. |
| CELLS_REMOVED | Specifies the event name for cellsRemoved. |
| GROUP_CELLS | Specifies the event name for groupCells. |
| UNGROUP_CELLS | Specifies the event name for ungroupCells. |
| REMOVE_CELLS_FROM_PARENT | Specifies the event name for removeCellsFromParent. |
| FOLD_CELLS | Specifies the event name for foldCells. |
| CELLS_FOLDED | Specifies the event name for cellsFolded. |
| ALIGN_CELLS | Specifies the event name for alignCells. |
| LABEL_CHANGED | Specifies the event name for labelChanged. |
| CONNECT_CELL | Specifies the event name for connectCell. |
| CELL_CONNECTED | Specifies the event name for cellConnected. |
| SPLIT_EDGE | Specifies the event name for splitEdge. |
| FLIP_EDGE | Specifies the event name for flipEdge. |
| START_EDITING | Specifies the event name for startEditing. |
| EDITING_STARTED | Specifies the event name for editingStarted. |
| EDITING_STOPPED | Specifies the event name for editingStopped. |
| ADD_OVERLAY | Specifies the event name for addOverlay. |
| REMOVE_OVERLAY | Specifies the event name for removeOverlay. |
| UPDATE_CELL_SIZE | Specifies the event name for updateCellSize. |
| ESCAPE | Specifies the event name for escape. |
| DOUBLE_CLICK | Specifies the event name for doubleClick. |
| START | Specifies the event name for start. |
| RESET | Specifies the event name for reset. |
addListener: function()
Binds the function to the specified event on the given element. Use mxUtils.bind in order to bind the “this” keyword inside the function to a given execution scope.
addGestureListeners: function( node, startListener, moveListener, endListener )
Adds the given listeners for touch, mouse and/or pointer events. If mxClient.IS_POINTER is true then pointer events will be registered, else the respective mouse events will be registered. If mxClient.IS_POINTER is false and mxClient.IS_TOUCH is true then the respective touch events will be registered as well as the mouse events.
removeGestureListeners: function( node, startListener, moveListener, endListener )
Removes the given listeners from mousedown, mousemove, mouseup and the respective touch events if mxClient.IS_TOUCH is true.
redirectMouseEvents: function( node, graph, state, down, move, up, dblClick )
Redirects the mouse events from the given DOM node to the graph dispatch loop using the event and given state as event arguments. State can either be an instance of mxCellState or a function that returns an mxCellState. The down, move, up and dblClick arguments are optional functions that take the trigger event as arguments and replace the default behaviour.
isConsumed: function( evt )
Returns true if the event has been consumed using consume.
isLeftMouseButton: function( evt )
Returns true if the left mouse button is pressed for the given event. To check if a button is pressed during a mouseMove you should use the mxGraph.isMouseDown property. Note that this returns true in Firefox for control+left-click on the Mac.
isMiddleMouseButton: function( evt )
Returns true if the middle mouse button is pressed for the given event. To check if a button is pressed during a mouseMove you should use the mxGraph.isMouseDown property.
isRightMouseButton: function( evt )
Returns true if the right mouse button was pressed. Note that this button might not be available on some systems. For handling a popup trigger isPopupTrigger should be used.
XML HTTP request wrapper. See also: mxUtils.get, mxUtils.post and mxUtils.load. This class provides a cross-browser abstraction for Ajax requests.
For encoding parameter values, the built-in encodeURIComponent JavaScript method must be used. For automatic encoding of post data in mxEditor the mxEditor.escapePostData switch can be set to true (default). The encoding will be carried out using the conte type of the page. That is, the page containting the editor should contain a meta tag in the header, eg. <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8”>
var onload = function(req)
{
mxUtils.alert(req.getDocumentElement());
}
var onerror = function(req)
{
mxUtils.alert('Error');
}
new mxXmlRequest(url, 'key=value').send(onload, onerror);Sends an asynchronous POST request to the specified URL.
var req = new mxXmlRequest(url, 'key=value', 'POST', false); req.send(); mxUtils.alert(req.getDocumentElement());
Sends a synchronous POST request to the specified URL.
var encoder = new mxCodec(); var result = encoder.encode(graph.getModel()); var xml = encodeURIComponent(mxUtils.getXml(result)); new mxXmlRequest(url, 'xml='+xml).send();
Sends an encoded graph model to the specified URL using xml as the parameter name. The parameter can then be retrieved in C# as follows:
string xml = HttpUtility.UrlDecode(context.Request.Params["xml"]);
String xml = URLDecoder.decode(request.getParameter("xml"), "UTF-8").replace("\n", "
");Note that the linefeeds should only be replaced if the XML is processed in Java, for example when creating an image.
| Functions | |
| mxXmlRequest | Constructs an XML HTTP request. |
| Variables | |
| url | Holds the target URL of the request. |
| params | Holds the form encoded data for the POST request. |
| method | Specifies the request method. |
| async | Boolean indicating if the request is asynchronous. |
| binary | Boolean indicating if the request is binary. |
| withCredentials | Specifies if withCredentials should be used in HTML5-compliant browsers. |
| username | Specifies the username to be used for authentication. |
| password | Specifies the password to be used for authentication. |
| request | Holds the inner, browser-specific request object. |
| decodeSimulateValues | Specifies if request values should be decoded as URIs before setting the textarea value in simulate. |
| Functions | |
| isBinary | Returns binary. |
| setBinary | Sets binary. |
| getText | Returns the response as a string. |
| isReady | Returns true if the response is ready. |
| getDocumentElement | Returns the document element of the response XML document. |
| getXml | Returns the response as an XML document. |
| getText | Returns the response as a string. |
| getStatus | Returns the status as a number, eg. |
| create | Creates and returns the inner request object. |
| send | Send the request to the target URL using the specified functions to process the response asychronously. |
| setRequestHeaders | Sets the headers for the given request and parameters. |
| simulate | Creates and posts a request to the given target URL using a dynamically created form inside the given document. |
function mxXmlRequest( url, params, method, async, username, password )
Constructs an XML HTTP request.
| url | Target URL of the request. |
| params | Form encoded parameters to send with a POST request. |
| method | String that specifies the request method. Possible values are POST and GET. Default is POST. |
| async | Boolean specifying if an asynchronous request should be used. Default is true. |
| username | String specifying the username to be used for the request. |
| password | String specifying the password to be used for the request. |
mxXmlRequest.prototype.decodeSimulateValues
Specifies if request values should be decoded as URIs before setting the textarea value in simulate. Defaults to false for backwards compatibility, to avoid another decode on the server this should be set to true.
mxXmlRequest.prototype.isBinary = function()
Returns binary.
mxXmlRequest.prototype.setBinary = function( value )
Sets binary.
mxXmlRequest.prototype.getXml = function()
Returns the response as an XML document. Use getDocumentElement to get the document element of the XML document.
mxXmlRequest.prototype.create = function()
Creates and returns the inner request object.
mxXmlRequest.prototype.send = function( onload, onerror, timeout, ontimeout )
Send the request to the target URL using the specified functions to process the response asychronously.
Note: Due to technical limitations, onerror is currently ignored.
| onload | Function to be invoked if a successful response was received. |
| onerror | Function to be called on any error. |
| timeout | Optional timeout in ms before calling ontimeout. |
| ontimeout | Optional function to execute on timeout. |
mxXmlRequest.prototype.setRequestHeaders = function( request, params )
Sets the headers for the given request and parameters. This sets the content-type to application/x-www-form-urlencoded if any params exist.
request.setRequestHeaders = function(request, params)
{
if (params != null)
{
request.setRequestHeader('Content-Type',
'multipart/form-data');
request.setRequestHeader('Content-Length',
params.length);
}
};Use the code above before calling send if you require a multipart/form-data request.
Singleton that implements a clipboard for graph cells.
mxClipboard.copy(graph); mxClipboard.paste(graph2);
This copies the selection cells from the graph to the clipboard and pastes them into graph2.
For fine-grained control of the clipboard data the mxGraph.canExportCell and mxGraph.canImportCell functions can be overridden.
To restore previous parents for pasted cells, the implementation for copy and paste can be changed as follows.
mxClipboard.copy = function(graph, cells)
{
cells = cells || graph.getSelectionCells();
var result = graph.getExportableCells(cells);
mxClipboard.parents = new Object();
for (var i = 0; i < result.length; i++)
{
mxClipboard.parents[i] = graph.model.getParent(cells[i]);
}
mxClipboard.insertCount = 1;
mxClipboard.setCells(graph.cloneCells(result));
return result;
};
mxClipboard.paste = function(graph)
{
if (!mxClipboard.isEmpty())
{
var cells = graph.getImportableCells(mxClipboard.getCells());
var delta = mxClipboard.insertCount * mxClipboard.STEPSIZE;
var parent = graph.getDefaultParent();
graph.model.beginUpdate();
try
{
for (var i = 0; i < cells.length; i++)
{
var tmp = (mxClipboard.parents != null && graph.model.contains(mxClipboard.parents[i])) ?
mxClipboard.parents[i] : parent;
cells[i] = graph.importCells([cells[i]], delta, delta, tmp)[0];
}
}
finally
{
graph.model.endUpdate();
}
// Increments the counter and selects the inserted cells
mxClipboard.insertCount++;
graph.setSelectionCells(cells);
}
};| Variables | |
| STEPSIZE | Defines the step size to offset the cells after each paste operation. |
| insertCount | Counts the number of times the clipboard data has been inserted. |
| cells | Holds the array of mxCells currently in the clipboard. |
| Functions | |
| setCells | Sets the cells in the clipboard. |
| getCells | Returns the cells in the clipboard. |
| isEmpty | Returns true if the clipboard currently has not data stored. |
| cut | Cuts the given array of mxCells from the specified graph. |
| removeCells | Hook to remove the given cells from the given graph after a cut operation. |
| copy | Copies the given array of mxCells from the specified graph to cells. |
| paste | Pastes the cells into the specified graph restoring the relation to <parents>, if possible. |
Holds the array of mxCells currently in the clipboard.
setCells: function( cells )
Sets the cells in the clipboard. Fires a mxEvent.CHANGE event.
cut: function( graph, cells )
Cuts the given array of mxCells from the specified graph. If cells is null then the selection cells of the graph will be used. Returns the cells that have been cut from the graph.
| graph | mxGraph that contains the cells to be cut. |
| cells | Optional array of mxCells to be cut. |
copy: function( graph, cells )
Copies the given array of mxCells from the specified graph to cells. Returns the original array of cells that has been cloned. Descendants of cells in the array are ignored.
| graph | mxGraph that contains the cells to be copied. |
| cells | Optional array of mxCells to be copied. |
paste: function( graph )
Pastes the cells into the specified graph restoring the relation to <parents>, if possible. If the parents are no longer in the graph or invisible then the cells are added to the graph’s default or into the swimlane under the cell’s new location if one exists. The cells are added to the graph using mxGraph.importCells and returned.
| graph | mxGraph to paste the cells into. |
Basic window inside a document.
Creating a simple window.
var tb = document.createElement('div');
var wnd = new mxWindow('Title', tb, 100, 100, 200, 200, true, true);
wnd.setVisible(true);Creating a window that contains an iframe.
var frame = document.createElement('iframe');
frame.setAttribute('width', '192px');
frame.setAttribute('height', '172px');
frame.setAttribute('src', 'http://www.example.com/');
frame.style.backgroundColor = 'white';
var w = document.body.clientWidth;
var h = (document.body.clientHeight || document.documentElement.clientHeight);
var wnd = new mxWindow('Title', frame, (w-200)/2, (h-200)/3, 200, 200);
wnd.setVisible(true);To limit the movement of a window, eg. to keep it from being moved beyond the top, left corner the following method can be overridden (recommended):
wnd.setLocation = function(x, y)
{
x = Math.max(0, x);
y = Math.max(0, y);
mxWindow.prototype.setLocation.apply(this, arguments);
};wnd.addListener(mxEvent.MOVE, function(e)
{
wnd.setLocation(Math.max(0, wnd.getX()), Math.max(0, wnd.getY()));
});mxEvent.addListener(window, 'resize', mxUtils.bind(this, function()
{
var iw = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
var ih = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
var x = this.window.getX();
var y = this.window.getY();
if (x + this.window.table.clientWidth > iw)
{
x = Math.max(0, iw - this.window.table.clientWidth);
}
if (y + this.window.table.clientHeight > ih)
{
y = Math.max(0, ih - this.window.table.clientHeight);
}
if (this.window.getX() != x || this.window.getY() != y)
{
this.window.setLocation(x, y);
}
}));| Events | |
| mxEvent. | Fires before the window is moved. |
| mxEvent.MOVE | Fires while the window is being moved. |
| mxEvent. | Fires after the window is moved. |
| mxEvent. | Fires before the window is resized. |
| mxEvent. | Fires while the window is being resized. |
| mxEvent. | Fires after the window is resized. |
| mxEvent. | Fires after the window is maximized. |
| mxEvent. | Fires after the window is minimized. |
| mxEvent. | Fires after the window is normalized, that is, it returned from maximized or minimized state. |
| mxEvent. | Fires after a window is activated. |
| mxEvent.SHOW | Fires after the window is shown. |
| mxEvent.HIDE | Fires after the window is hidden. |
| mxEvent. | Fires before the window is closed. |
| mxEvent. | Fires before the window is destroyed. |
| Functions | |
| mxWindow | Constructs a new window with the given dimension and title to display the specified content. |
| Variables | |
| closeImage | URL of the image to be used for the close icon in the titlebar. |
| minimizeImage | URL of the image to be used for the minimize icon in the titlebar. |
| normalizeImage | URL of the image to be used for the normalize icon in the titlebar. |
| maximizeImage | URL of the image to be used for the maximize icon in the titlebar. |
| normalizeImage | URL of the image to be used for the resize icon. |
| visible | Boolean flag that represents the visible state of the window. |
| minimumSize | mxRectangle that specifies the minimum width and height of the window. |
| destroyOnClose | Specifies if the window should be destroyed when it is closed. |
| contentHeightCorrection | Defines the correction factor for computing the height of the contentWrapper. |
| title | Reference to the DOM node (TD) that contains the title. |
| content | Reference to the DOM node that represents the window content. |
| Functions | |
| init | Initializes the DOM tree that represents the window. |
| setTitle | Sets the window title to the given string. |
| setScrollable | Sets if the window contents should be scrollable. |
| activate | Puts the window on top of all other windows. |
| getElement | Returuns the outermost DOM node that makes up the window. |
| fit | Makes sure the window is inside the client area of the window. |
| isResizable | Returns true if the window is resizable. |
| setResizable | Sets if the window should be resizable. |
| setSize | Sets the size of the window. |
| setMinimizable | Sets if the window is minimizable. |
| getMinimumSize | Returns an mxRectangle that specifies the size for the minimized window. |
| installMinimizeHandler | Installs the event listeners required for minimizing the window. |
| setMaximizable | Sets if the window is maximizable. |
| installMaximizeHandler | Installs the event listeners required for maximizing the window. |
| installMoveHandler | Installs the event listeners required for moving the window. |
| setLocation | Sets the upper, left corner of the window. |
| getX | Returns the current position on the x-axis. |
| getY | Returns the current position on the y-axis. |
| installCloseHandler | Adds the closeImage as a new image node in <closeImg> and installs the <close> event. |
| setImage | Sets the image associated with the window. |
| setClosable | Sets the image associated with the window. |
| isVisible | Returns true if the window is visible. |
| setVisible | Shows or hides the window depending on the given flag. |
| show | Shows the window. |
| hide | Hides the window. |
| destroy | Destroys the window and removes all associated resources. |
function mxWindow( title, content, x, y, width, height, minimizable, movable, replaceNode, style )
Constructs a new window with the given dimension and title to display the specified content. The window elements use the given style as a prefix for the classnames of the respective window elements, namely, the window title and window pane. The respective postfixes are appended to the given stylename as follows:
| style | Base style for the window. |
| style+Title | Style for the window title. |
| style+Pane | Style for the window pane. |
The default value for style is mxWindow, resulting in the following classnames for the window elements: mxWindow, mxWindowTitle and mxWindowPane.
If replaceNode is given then the window replaces the given DOM node in the document.
| title | String that represents the title of the new window. |
| content | DOM node that is used as the window content. |
| x | X-coordinate of the window location. |
| y | Y-coordinate of the window location. |
| width | Width of the window. |
| height | Optional height of the window. Default is to match the height of the content at the specified width. |
| minimizable | Optional boolean indicating if the window is minimizable. Default is true. |
| movable | Optional boolean indicating if the window is movable. Default is true. |
| replaceNode | Optional DOM node that the window should replace. |
| style | Optional base classname for the window elements. Default is mxWindow. |
mxWindow.prototype.minimumSize
mxRectangle that specifies the minimum width and height of the window. Default is (50, 40).
mxWindow.prototype.destroyOnClose
Specifies if the window should be destroyed when it is closed. If this is false then the window is hidden using setVisible. Default is true.
mxWindow.prototype.setResizable = function( resizable )
Sets if the window should be resizable. To avoid interference with some built-in features of IE10 and later, the use of the following code is recommended if there are resizable mxWindows in the page:
if (mxClient.IS_POINTER)
{
document.body.style.msTouchAction = 'none';
}
mxWindow.prototype.getMinimumSize = function()
Returns an mxRectangle that specifies the size for the minimized window. A width or height of 0 means keep the existing width or height. This implementation returns the height of the window title and keeps the width.
mxWindow.prototype.installCloseHandler = function()
Adds the closeImage as a new image node in <closeImg> and installs the <close> event.
mxWindow.prototype.destroy = function()
Destroys the window and removes all associated resources. Fires a destroy event prior to destroying the window.
A simple class for creating HTML forms.
| Functions | |
| mxForm | Creates a HTML table using the specified classname. |
| Variables | |
| table | Holds the DOM node that represents the table. |
| body | Holds the DOM node that represents the tbody (table body). |
| Functions | |
| getTable | Returns the table that contains this form. |
| addButtons | Helper method to add an OK and Cancel button using the respective functions. |
| addText | Adds an input for the given name, type and value and returns it. |
| addCheckbox | Adds a checkbox for the given name and value and returns the textfield. |
| addTextarea | Adds a textarea for the given name and value and returns the textarea. |
| addCombo | Adds a combo for the given name and returns the combo. |
| addOption | Adds an option for the given label to the specified combo. |
| addField | Adds a new row with the name and the input field in two columns and returns the given input. |
Maintains the size of a div element in Internet Explorer. This is a workaround for the right and bottom style being ignored in IE.
If you need a div to cover the scrollwidth and -height of a document, then you can use this class as follows:
var resizer = new mxDivResizer(background);
resizer.getDocumentHeight = function()
{
return document.body.scrollHeight;
}
resizer.getDocumentWidth = function()
{
return document.body.scrollWidth;
}
resizer.resize();| Functions | |
| mxDivResizer | Constructs an object that maintains the size of a div element when the window is being resized. |
| resizeWidth | Boolean specifying if the width should be updated. |
| resizeHeight | Boolean specifying if the height should be updated. |
| handlingResize | Boolean specifying if the width should be updated. |
| resize | Updates the style of the DIV after the window has been resized. |
| getDocumentWidth | Hook for subclassers to return the width of the document (without scrollbars). |
| getDocumentHeight | Hook for subclassers to return the height of the document (without scrollbars). |
function mxDivResizer( div, container )
Constructs an object that maintains the size of a div element when the window is being resized. This is only required for Internet Explorer as it ignores the respective stylesheet information for DIV elements.
| div | Reference to the DOM node whose size should be maintained. |
| container | Optional Container that contains the div. Default is the window. |
Wrapper to create a drag source from a DOM element so that the element can be dragged over a graph and dropped into the graph as a new cell.
Problem is that in the dropHandler the current preview location is not available, so the preview and the dropHandler must match.
| Functions | |
| mxDragSource | Constructs a new drag source for the given element. |
| Variables | |
| element | Reference to the DOM node which was made draggable. |
| dropHandler | Holds the DOM node that is used to represent the drag preview. |
| dragOffset | mxPoint that specifies the offset of the dragElement. |
| dragElement | Holds the DOM node that is used to represent the drag preview. |
| previewElement | Optional mxRectangle that specifies the unscaled size of the preview. |
| enabled | Specifies if this drag source is enabled. |
| currentGraph | Reference to the mxGraph that is the current drop target. |
| currentDropTarget | Holds the current drop target under the mouse. |
| currentPoint | Holds the current drop location. |
| currentGuide | Holds an mxGuide for the currentGraph if <dragPreview> is not null. |
| currentGuide | Holds an mxGuide for the currentGraph if <dragPreview> is not null. |
| autoscroll | Specifies if the graph should scroll automatically. |
| guidesEnabled | Specifies if mxGuide should be enabled. |
| gridEnabled | Specifies if the grid should be allowed. |
| highlightDropTargets | Specifies if drop targets should be highlighted. |
| dragElementZIndex | ZIndex for the drag element. |
| dragElementOpacity | Opacity of the drag element in %. |
| checkEventSource | Whether the event source should be checked in <graphContainerEvent>. |
| Functions | |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| isGuidesEnabled | Returns guidesEnabled. |
| setGuidesEnabled | Sets guidesEnabled. |
| isGridEnabled | Returns gridEnabled. |
| setGridEnabled | Sets gridEnabled. |
| getGraphForEvent | Returns the graph for the given mouse event. |
| getDropTarget | Returns the drop target for the given graph and coordinates. |
| createDragElement | Creates and returns a clone of the <dragElementPrototype> or the element if the former is not defined. |
| createPreviewElement | Creates and returns an element which can be used as a preview in the given graph. |
| isActive | Returns true if this drag source is active. |
| reset | Stops and removes everything and restores the state of the object. |
| mouseDown | Returns the drop target for the given graph and coordinates. |
| startDrag | Creates the dragElement using createDragElement. |
| stopDrag | Invokes removeDragElement. |
| removeDragElement | Removes and destroys the dragElement. |
| getElementForEvent | Returns the topmost element under the given event. |
| graphContainsEvent | Returns true if the given graph contains the given event. |
| mouseMove | Gets the graph for the given event using getGraphForEvent, updates the currentGraph, calling dragEnter and dragExit on the new and old graph, respectively, and invokes dragOver if currentGraph is not null. |
| mouseUp | Processes the mouse up event and invokes drop, dragExit and stopDrag as required. |
| removeListeners | Actives the given graph as a drop target. |
| dragEnter | Actives the given graph as a drop target. |
| dragExit | Deactivates the given graph as a drop target. |
| dragOver | Implements autoscroll, updates the currentPoint, highlights any drop targets and updates the preview. |
| drop | Returns the drop target for the given graph and coordinates. |
mxDragSource.prototype.dragOffset
mxPoint that specifies the offset of the dragElement. Default is null.
mxDragSource.prototype.previewElement
Optional mxRectangle that specifies the unscaled size of the preview.
mxDragSource.prototype.currentGraph
Reference to the mxGraph that is the current drop target.
mxDragSource.prototype.currentGuide
Holds an mxGuide for the currentGraph if <dragPreview> is not null.
Holds an mxGuide for the currentGraph if <dragPreview> is not null.
mxDragSource.prototype.guidesEnabled
Specifies if mxGuide should be enabled. Default is true.
mxDragSource.prototype.isEnabled = function()
Returns enabled.
mxDragSource.prototype.setEnabled = function( value )
Sets enabled.
mxDragSource.prototype.isGuidesEnabled = function()
Returns guidesEnabled.
mxDragSource.prototype.setGuidesEnabled = function( value )
Sets guidesEnabled.
mxDragSource.prototype.isGridEnabled = function()
Returns gridEnabled.
mxDragSource.prototype.setGridEnabled = function( value )
Sets gridEnabled.
mxDragSource.prototype.getDropTarget = function( graph, x, y, evt )
Returns the drop target for the given graph and coordinates. This implementation uses mxGraph.getCellAt.
mxDragSource.prototype.createDragElement = function( evt )
Creates and returns a clone of the <dragElementPrototype> or the element if the former is not defined.
mxDragSource.prototype.mouseDown = function( evt )
Returns the drop target for the given graph and coordinates. This implementation uses mxGraph.getCellAt.
To ignore popup menu events for a drag source, this function can be overridden as follows.
var mouseDown = dragSource.mouseDown;
dragSource.mouseDown = function(evt)
{
if (!mxEvent.isPopupTrigger(evt))
{
mouseDown.apply(this, arguments);
}
};
mxDragSource.prototype.startDrag = function( evt )
Creates the dragElement using createDragElement.
mxDragSource.prototype.stopDrag = function()
Invokes removeDragElement.
mxDragSource.prototype.removeDragElement = function()
Removes and destroys the dragElement.
mxDragSource.prototype.mouseMove = function( evt )
Gets the graph for the given event using getGraphForEvent, updates the currentGraph, calling dragEnter and dragExit on the new and old graph, respectively, and invokes dragOver if currentGraph is not null.
mxDragSource.prototype.dragOver = function( graph, evt )
Implements autoscroll, updates the currentPoint, highlights any drop targets and updates the preview.
mxDragSource.prototype.drop = function( graph, evt, dropTarget, x, y )
Returns the drop target for the given graph and coordinates. This implementation uses mxGraph.getCellAt.
Creates a toolbar inside a given DOM node. The toolbar may contain icons, buttons and combo boxes.
| Events | |
| mxEvent. | Fires when an item was selected in the toolbar. |
| Functions | |
| mxToolbar | Constructs a toolbar in the specified container. |
| Variables | |
| container | Reference to the DOM nodes that contains the toolbar. |
| enabled | Specifies if events are handled. |
| noReset | Specifies if resetMode requires a forced flag of true for resetting the current mode in the toolbar. |
| updateDefaultMode | Boolean indicating if the default mode should be the last selected switch mode or the first inserted switch mode. |
| Functions | |
| addItem | Adds the given function as an image with the specified title and icon and returns the new image node. |
| addCombo | Adds and returns a new SELECT element using the given style. |
| addCombo | Adds and returns a new SELECT element using the given title as the default element. |
| addOption | Adds and returns a new OPTION element inside the given SELECT element. |
| addSwitchMode | Adds a new selectable item to the toolbar. |
| addMode | Adds a new item to the toolbar. |
| selectMode | Resets the state of the previously selected mode and displays the given DOM node as selected. |
| resetMode | Selects the default mode and resets the state of the previously selected mode. |
| addSeparator | Adds the specifies image as a separator. |
| addBreak | Adds a break to the container. |
| addLine | Adds a horizontal line to the container. |
| destroy | Removes the toolbar and all its associated resources. |
Fires when an item was selected in the toolbar. The <code>function</code> property contains the function that was selected in selectMode.
mxToolbar.prototype.noReset
Specifies if resetMode requires a forced flag of true for resetting the current mode in the toolbar. Default is false. This is set to true if the toolbar item is double clicked to avoid a reset after a single use of the item.
mxToolbar.prototype.updateDefaultMode
Boolean indicating if the default mode should be the last selected switch mode or the first inserted switch mode. Default is true, that is the last selected switch mode is the default mode. The default mode is the mode to be selected after a reset of the toolbar. If this is false, then the default mode is the first inserted mode item regardless of what was last selected. Otherwise, the selected item after a reset is the previously selected item.
mxToolbar.prototype.addItem = function( title, icon, funct, pressedIcon, style, factoryMethod )
Adds the given function as an image with the specified title and icon and returns the new image node.
| title | Optional string that is used as the tooltip. |
| icon | Optional URL of the image to be used. If no URL is given, then a button is created. |
| funct | Function to execute on a mouse click. |
| pressedIcon | Optional URL of the pressed image. Default is a gray background. |
| style | Optional style classname. Default is mxToolbarItem. |
| factoryMethod | Optional factory method for popup menu, eg. function(menu, evt, cell) { menu.addItem(‘Hello, World!’); } |
mxToolbar.prototype.addOption = function( combo, title, value )
Adds and returns a new OPTION element inside the given SELECT element. If the given value is a function then it is stored in the option’s funct field.
| combo | SELECT element that will contain the new entry. |
| title | String that specifies the title of the option. |
| value | Specifies the value associated with this option. |
mxToolbar.prototype.addMode = function( title, icon, funct, pressedIcon, style, toggle )
Adds a new item to the toolbar. The selection is typically reset after the item has been consumed, for example by adding a new vertex to the graph. The reset is not carried out if the item is double clicked.
The function argument uses the following signature: funct(evt, cell) where evt is the native mouse event and cell is the cell under the mouse.
Implements a composite undoable edit. Here is an example for a custom change which gets executed via the model:
function CustomChange(model, name)
{
this.model = model;
this.name = name;
this.previous = name;
};
CustomChange.prototype.execute = function()
{
var tmp = this.model.name;
this.model.name = this.previous;
this.previous = tmp;
};
var name = prompt('Enter name');
graph.model.execute(new CustomChange(graph.model, name));| Events | |
| mxEvent. | Fires between START_EDIT and END_EDIT after an atomic change was executed. |
| mxEvent. | Fires before a set of changes will be executed in undo or redo. |
| mxEvent. | Fires after a set of changeswas executed in undo or redo. |
| Functions | |
| mxUndoableEdit | Constructs a new undoable edit for the given source. |
| Variables | |
| source | Specifies the source of the edit. |
| changes | Array that contains the changes that make up this edit. |
| significant | Specifies if the undoable change is significant. |
| undone | Specifies if this edit has been undone. |
| redone | Specifies if this edit has been redone. |
| Functions | |
| isEmpty | Returns true if the this edit contains no changes. |
| isSignificant | Returns significant. |
| add | Adds the specified change to this edit. |
| notify | Hook to notify any listeners of the changes after an undo or redo has been carried out. |
| die | Hook to free resources after the edit has been removed from the command history. |
| undo | Undoes all changes in this edit. |
| redo | Redoes all changes in this edit. |
mxUndoableEdit.prototype.isSignificant = function()
Returns significant.
Implements a command history. When changing the graph model, an <mxUndoableChange> object is created at the start of the transaction (when model.beginUpdate is called). All atomic changes are then added to this object until the last model.endUpdate call, at which point the mxUndoableEdit is dispatched in an event, and added to the history inside mxUndoManager. This is done by an event listener in mxEditor.installUndoHandler.
Each atomic change of the model is represented by an object (eg. mxRootChange, mxChildChange, mxTerminalChange etc) which contains the complete undo information. The mxUndoManager also listens to the mxGraphView and stores it’s changes to the current root as insignificant undoable changes, so that drilling (step into, step up) is undone.
This means when you execute an atomic change on the model, then change the current root on the view and click undo, the change of the root will be undone together with the change of the model so that the display represents the state at which the model was changed. However, these changes are not transmitted for sharing as they do not represent a state change.
When adding an undo manager to a graph, make sure to add it to the model and the view as well to maintain a consistent display across multiple undo/redo steps.
var undoManager = new mxUndoManager();
var listener = function(sender, evt)
{
undoManager.undoableEditHappened(evt.getProperty('edit'));
};
graph.getModel().addListener(mxEvent.UNDO, listener);
graph.getView().addListener(mxEvent.UNDO, listener);The code creates a function that informs the undoManager of an undoable edit and binds it to the undo event of mxGraphModel and mxGraphView using mxEventSource.addListener.
| Events | |
| mxEvent. | Fires after clear was invoked. |
| mxEvent.UNDO | Fires afer a significant edit was undone in undo. |
| mxEvent.REDO | Fires afer a significant edit was redone in redo. |
| mxEvent.ADD | Fires after an undoable edit was added to the history. |
| Functions | |
| mxUndoManager | Constructs a new undo manager with the given history size. |
| Variables | |
| size | Maximum command history size. |
| history | Array that contains the steps of the command history. |
| indexOfNextAdd | Index of the element to be added next. |
| Functions | |
| isEmpty | Returns true if the history is empty. |
| clear | Clears the command history. |
| canUndo | Returns true if an undo is possible. |
| undo | Undoes the last change. |
| canRedo | Returns true if a redo is possible. |
| redo | Redoes the last change. |
| undoableEditHappened | Method to be called to add new undoable edits to the history. |
| trim | Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit. |
Fires after clear was invoked. This event has no properties.
Fires afer a significant edit was undone in undo. The <code>edit</code> property contains the mxUndoableEdit that was undone.
Fires afer a significant edit was redone in redo. The <code>edit</code> property contains the mxUndoableEdit that was redone.
Fires after an undoable edit was added to the history. The <code>edit</code> property contains the mxUndoableEdit that was added.
mxUndoManager.prototype.undoableEditHappened = function( undoableEdit )
Method to be called to add new undoable edits to the history.
mxUndoManager.prototype.trim = function()
Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit. This is called from undoableEditHappened.
Converts relative and absolute URLs to absolute URLs with protocol and domain.
| Variables | |
| enabled | Specifies if the converter is enabled. |
| baseUrl | Specifies the base URL to be used as a prefix for relative URLs. |
| baseDomain | Specifies the base domain to be used as a prefix for absolute URLs. |
| Functions | |
| updateBaseUrl | Private helper function to update the base URL. |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| getBaseUrl | Returns baseUrl. |
| setBaseUrl | Sets baseUrl. |
| getBaseDomain | Returns baseDomain. |
| setBaseDomain | Sets baseDomain. |
| isRelativeUrl | Returns true if the given URL is relative. |
| convert | Converts the given URL to an absolute URL with protol and domain. |
mxUrlConverter.prototype.isEnabled = function()
Returns enabled.
mxUrlConverter.prototype.setEnabled = function( value )
Sets enabled.
mxUrlConverter.prototype.getBaseUrl = function()
Returns baseUrl.
mxUrlConverter.prototype.setBaseUrl = function( value )
Sets baseUrl.
mxUrlConverter.prototype.getBaseDomain = function()
Returns baseDomain.
mxUrlConverter.prototype.setBaseDomain = function( value )
Sets baseDomain.
Implements a handler for panning.
| Variables | |
| damper | Damper value for the panning. |
| delay | Delay in milliseconds for the panning. |
| handleMouseOut | Specifies if mouse events outside of the component should be handled. |
| border | Border to handle automatic panning inside the component. |
Basic popup menu. To add a vertical scrollbar to a given submenu, the following code can be used.
var mxPopupMenuShowMenu = mxPopupMenu.prototype.showMenu;
mxPopupMenu.prototype.showMenu = function()
{
mxPopupMenuShowMenu.apply(this, arguments);
this.div.style.overflowY = 'auto';
this.div.style.overflowX = 'hidden';
this.div.style.maxHeight = '160px';
};| Functions | |
| mxPopupMenu | Constructs a popupmenu. |
| Events | |
| mxEvent.SHOW | Fires after the menu has been shown in popup. |
| Variables | |
| submenuImage | URL of the image to be used for the submenu icon. |
| zIndex | Specifies the zIndex for the popupmenu and its shadow. |
| factoryMethod | Function that is used to create the popup menu. |
| useLeftButtonForPopup | Specifies if popupmenus should be activated by clicking the left mouse button. |
| enabled | Specifies if events are handled. |
| itemCount | Contains the number of times addItem has been called for a new menu. |
| autoExpand | Specifies if submenus should be expanded on mouseover. |
| smartSeparators | Specifies if separators should only be added if a menu item follows them. |
| labels | Specifies if any labels should be visible. |
| Functions | |
| init | Initializes the shapes required for this vertex handler. |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isPopupTrigger | Returns true if the given event is a popupmenu trigger for the optional given cell. |
| addItem | Adds the given item to the given parent item. |
| createSubmenu | Creates the nodes required to add submenu items inside the given parent item. |
| showSubmenu | Shows the submenu inside the given parent row. |
| addSeparator | Adds a horizontal separator in the given parent item or the top-level menu if no parent is specified. |
| popup | Shows the popup menu for the given event and cell. |
| isMenuShowing | Returns true if the menu is showing. |
| showMenu | Shows the menu. |
| hideMenu | Removes the menu and all submenus. |
| hideSubmenu | Removes all submenus inside the given parent. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
Fires after the menu has been shown in popup.
mxPopupMenu.prototype.factoryMethod
Function that is used to create the popup menu. The function takes the current panning handler, the mxCell under the mouse and the mouse event that triggered the call as arguments.
mxPopupMenu.prototype.itemCount
Contains the number of times addItem has been called for a new menu.
mxPopupMenu.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxPopupMenu.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
mxPopupMenu.prototype.isPopupTrigger = function( me )
Returns true if the given event is a popupmenu trigger for the optional given cell.
| me | mxMouseEvent that represents the mouse event. |
mxPopupMenu.prototype.addItem = function( title, image, funct, parent, iconCls, enabled, active )
Adds the given item to the given parent item. If no parent item is specified then the item is added to the top-level menu. The return value may be used as the parent argument, ie. as a submenu item. The return value is the table row that represents the item.
| title | String that represents the title of the menu item. |
| image | Optional URL for the image icon. |
| funct | Function associated that takes a mouseup or touchend event. |
| parent | Optional item returned by addItem. |
| iconCls | Optional string that represents the CSS class for the image icon. IconsCls is ignored if image is given. |
| enabled | Optional boolean indicating if the item is enabled. Default is true. |
| active | Optional boolean indicating if the menu should implement any event handling. Default is true. |
mxPopupMenu.prototype.createSubmenu = function( parent )
Creates the nodes required to add submenu items inside the given parent item. This is called in addItem if a parent item is used for the first time. This adds various DOM nodes and a submenuImage to the parent.
| parent | An item returned by addItem. |
mxPopupMenu.prototype.addSeparator = function( parent, force )
Adds a horizontal separator in the given parent item or the top-level menu if no parent is specified.
| parent | Optional item returned by addItem. |
| force | Optional boolean to ignore smartSeparators. Default is false. |
mxPopupMenu.prototype.hideSubmenu = function( parent )
Removes all submenus inside the given parent.
| parent | An item returned by addItem. |
Manager for automatically saving diagrams. The save hook must be implemented.
var mgr = new mxAutoSaveManager(editor.graph);
mgr.save = function()
{
mxLog.show();
mxLog.debug('save');
};| Functions | |
| mxAutoSaveManager | Constructs a new automatic layout for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| autoSaveDelay | Minimum amount of seconds between two consecutive autosaves. |
| autoSaveThrottle | Minimum amount of seconds between two consecutive autosaves triggered by more than <autoSaveThreshhold> changes within a timespan of less than autoSaveDelay seconds. |
| autoSaveThreshold | Minimum amount of ignored changes before an autosave. |
| ignoredChanges | Counter for ignored changes in autosave. |
| lastSnapshot | Used for autosaving. |
| enabled | Specifies if event handling is enabled. |
| changeHandler | Holds the function that handles graph model changes. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| setGraph | Sets the graph that the layouts operate on. |
| save | Empty hook that is called if the graph should be saved. |
| graphModelChanged | Invoked when the graph model has changed. |
| reset | Resets all counters. |
| destroy | Removes all handlers from the graph and deletes the reference to it. |
mxAutoSaveManager.prototype.graph
Reference to the enclosing mxGraph.
mxAutoSaveManager.prototype.autoSaveThrottle
Minimum amount of seconds between two consecutive autosaves triggered by more than <autoSaveThreshhold> changes within a timespan of less than autoSaveDelay seconds. Eg. a value of 1 (s) means the graph is not stored more than once per second even if there are more than autoSaveThreshold changes within that timespan. Default is 2.
mxAutoSaveManager.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxAutoSaveManager.prototype.setEnabled = function( value )
Enables or disables event handling. This implementation updates enabled.
| enabled | Boolean that specifies the new enabled state. |
mxAutoSaveManager.prototype.destroy = function()
Removes all handlers from the graph and deletes the reference to it.
Implements a basic animation in JavaScript.
| Functions | |
| mxAnimation | Constructs an animation. |
| Variables | |
| delay | Specifies the delay between the animation steps. |
| thread | Reference to the thread while the animation is running. |
| Functions | |
| isRunning | Returns true if the animation is running. |
| startAnimation | Starts the animation by repeatedly invoking updateAnimation. |
| updateAnimation | Hook for subclassers to implement the animation. |
| stopAnimation | Stops the animation by deleting the timer and fires an mxEvent.DONE. |
function mxAnimation( delay )
Constructs an animation.
| graph | Reference to the enclosing mxGraph. |
mxAnimation.prototype.stopAnimation = function()
Stops the animation by deleting the timer and fires an mxEvent.DONE.
Implements animation for morphing cells. Here is an example of using this class for animating the result of a layout algorithm:
graph.getModel().beginUpdate();
try
{
var circleLayout = new mxCircleLayout(graph);
circleLayout.execute(graph.getDefaultParent());
}
finally
{
var morph = new mxMorphing(graph);
morph.addListener(mxEvent.DONE, function()
{
graph.getModel().endUpdate();
});
morph.startAnimation();
}| Functions | |
| mxMorphing | Constructs an animation. |
| Variables | |
| graph | Specifies the delay between the animation steps. |
| steps | Specifies the maximum number of steps for the morphing. |
| step | Contains the current step. |
| ease | Ease-off for movement towards the given vector. |
| cells | Optional array of cells to be animated. |
| Functions | |
| updateAnimation | Animation step. |
| show | Shows the changes in the given mxCellStatePreview. |
| animateCell | Animates the given cell state using mxCellStatePreview.moveState. |
| stopRecursion | Returns true if the animation should not recursively find more deltas for children if the given parent state has been animated. |
| getDelta | Returns the vector between the current rendered state and the future location of the state after the display will be updated. |
| getOriginForCell | Returns the top, left corner of the given cell. |
function mxMorphing( graph, steps, ease, delay )
Constructs an animation.
| graph | Reference to the enclosing mxGraph. |
| steps | Optional number of steps in the morphing animation. Default is 6. |
| ease | Optional easing constant for the animation. Default is 1.5. |
| delay | Optional delay between the animation steps. Passed to mxAnimation. |
mxMorphing.prototype.show = function( move )
Shows the changes in the given mxCellStatePreview.
mxMorphing.prototype.animateCell = function( cell, move, recurse )
Animates the given cell state using mxCellStatePreview.moveState.
Maps from keys to base64 encoded images or file locations. All values must be URLs or use the format data:image/format followed by a comma and the base64 encoded image data, eg. “data:image/gif,XYZ”, where XYZ is the base64 encoded image data.
var bundle = new mxImageBundle(alt);
bundle.putImage('myImage', 'data:image/gif,R0lGODlhEAAQAMIGAAAAAICAAICAgP' +
'//AOzp2O3r2////////yH+FUNyZWF0ZWQgd2l0aCBUaGUgR0lNUAAh+QQBCgAHACwAAAAA' +
'EAAQAAADTXi63AowynnAMDfjPUDlnAAJhmeBFxAEloliKltWmiYCQvfVr6lBPB1ggxN1hi' +
'laSSASFQpIV5HJBDyHpqK2ejVRm2AAgZCdmCGO9CIBADs=', fallback);
bundle.putImage('mySvgImage', 'data:image/svg+xml,' + encodeURIComponent(
'<svg xmlns="http://www.w3.org/2000/svg" width="100%" height="100%">' +
'<linearGradient id="gradient"><stop offset="10%" stop-color="#F00"/>' +
'<stop offset="90%" stop-color="#fcc"/></linearGradient>' +
'<rect fill="url(#gradient)" width="100%" height="100%"/></svg>'), fallback);
graph.addImageBundle(bundle);
(end);
Alt is an optional boolean (default is false) that specifies if the value
or the fallback should be returned in <getImage>.
The image can then be referenced in any cell style using image=myImage.
If you are using mxOutline, you should use the same image bundles in the
graph that renders the outline.
The keys for images are resolved in <mxGraph.postProcessCellStyle> and
turned into a data URI if the returned value has a short data URI format
as specified above.
A typical value for the fallback is a MTHML link as defined in RFC 2557.
Note that this format requires a file to be dynamically created on the
server-side, or the page that contains the graph to be modified to contain
the resources, this can be done by adding a comment that contains the
resource in the HEAD section of the page after the title tag.
This type of fallback mechanism should be used in IE6 and IE7. IE8 does
support data URIs, but the maximum size is limited to 32 KB, which means
all data URIs should be limited to 32 KB.Creates a new image export instance to be used with an export canvas. Here is an example that uses this class to create an image via a backend using <mxXmlExportCanvas>.
var xmlDoc = mxUtils.createXmlDocument();
var root = xmlDoc.createElement('output');
xmlDoc.appendChild(root);
var xmlCanvas = new mxXmlCanvas2D(root);
var imgExport = new mxImageExport();
imgExport.drawState(graph.getView().getState(graph.model.root), xmlCanvas);
var bounds = graph.getGraphBounds();
var w = Math.ceil(bounds.x + bounds.width);
var h = Math.ceil(bounds.y + bounds.height);
var xml = mxUtils.getXml(root);
new mxXmlRequest('export', 'format=png&w=' + w +
'&h=' + h + '&bg=#F9F7ED&xml=' + encodeURIComponent(xml))
.simulate(document, '_blank');| Functions | |
| mxImageExport | Constructs a new image export. |
| Variables | |
| includeOverlays | Specifies if overlays should be included in the export. |
| Functions | |
| drawState | Draws the given state and all its descendants to the given canvas. |
| drawState | Draws the given state and all its descendants to the given canvas. |
| getLinkForCellState | Returns the link for the given cell state and canvas. |
| drawCellState | Draws the given state to the given canvas. |
| drawShape | Draws the shape of the given state. |
| drawText | Draws the text of the given state. |
| drawOverlays | Draws the overlays for the given state. |
mxImageExport.prototype.drawOverlays = function( state, canvas )
Draws the overlays for the given state. This is called if includeOverlays is true.
Base class for all canvases. A description of the public API is available in mxXmlCanvas2D. All color values of mxConstants.NONE will be converted to null in the state.
| Functions | |
| mxAbstractCanvas2D | Constructs a new abstract canvas. |
| Variables | |
| converter | Holds the mxUrlConverter to convert image URLs. |
| state | Holds the current state. |
| states | Stack of states. |
| path | Holds the current path as an array. |
| rotateHtml | Switch for rotation of HTML. |
| lastX | Holds the last x coordinate. |
| lastY | Holds the last y coordinate. |
| moveOp | Contains the string used for moving in paths. |
| lineOp | Contains the string used for moving in paths. |
| quadOp | Contains the string used for quadratic paths. |
| curveOp | Contains the string used for bezier curves. |
| closeOp | Holds the operator for closing curves. |
| pointerEvents | Boolean value that specifies if events should be handled. |
| Functions | |
| createUrlConverter | Create a new mxUrlConverter and returns it. |
| reset | Resets the state of this canvas. |
| createState | Creates the state of the this canvas. |
| format | Rounds all numbers to integers. |
| addOp | Adds the given operation to the path. |
| rotatePoint | Rotates the given point and returns the result as an mxPoint. |
| save | Saves the current state. |
| restore | Restores the current state. |
| setLink | Sets the current link. |
| scale | Scales the current state. |
| translate | Translates the current state. |
| rotate | Rotates the current state. |
| setAlpha | Sets the current alpha. |
| setFillAlpha | Sets the current solid fill alpha. |
| setStrokeAlpha | Sets the current stroke alpha. |
| setFillColor | Sets the current fill color. |
| setGradient | Sets the current gradient. |
| setStrokeColor | Sets the current stroke color. |
| setStrokeWidth | Sets the current stroke width. |
| setDashed | Enables or disables dashed lines. |
| setDashPattern | Sets the current dash pattern. |
| setLineCap | Sets the current line cap. |
| setLineJoin | Sets the current line join. |
| setMiterLimit | Sets the current miter limit. |
| setFontColor | Sets the current font color. |
| setFontColor | Sets the current font color. |
| setFontColor | Sets the current font color. |
| setFontSize | Sets the current font size. |
| setFontFamily | Sets the current font family. |
| setFontStyle | Sets the current font style. |
| setShadow | Enables or disables and configures the current shadow. |
| setShadowColor | Enables or disables and configures the current shadow. |
| setShadowAlpha | Enables or disables and configures the current shadow. |
| setShadowOffset | Enables or disables and configures the current shadow. |
| begin | Starts a new path. |
| moveTo | Moves the current path the given coordinates. |
| lineTo | Draws a line to the given coordinates. |
| quadTo | Adds a quadratic curve to the current path. |
| curveTo | Adds a bezier curve to the current path. |
| arcTo | Adds the given arc to the current path. |
| close | Closes the current path. |
| end | Empty implementation for backwards compatibility. |
this.converter
Holds the mxUrlConverter to convert image URLs.
mxAbstractCanvas2D.prototype.createUrlConverter = function()
Create a new mxUrlConverter and returns it.
mxAbstractCanvas2D.prototype.rotatePoint = function( x, y, theta, cx, cy )
Rotates the given point and returns the result as an mxPoint.
Base class for all canvases. The following methods make up the public interface of the canvas 2D for all painting in mxGraph:
mxAbstractCanvas2D.arcTo is an additional method for drawing paths. This is a synthetic method, meaning that it is turned into a sequence of curves by default. Subclassers may add native support for arcs.
| Functions | |
| mxXmlCanvas2D | Constructs a new abstract canvas. |
| Variables | |
| root | Reference to the container for the SVG content. |
| textEnabled | Specifies if text output should be enabled. |
| compressed | Specifies if the output should be compressed by removing redundant calls. |
| Functions | |
| writeDefaults | |
| format | Returns a formatted number with 2 decimal places. |
| createElement | Creates the given element using the owner document of root. |
| save | Saves the drawing state. |
| restore | Restores the drawing state. |
| scale | Scales the output. |
| translate | Translates the output. |
| rotate | Rotates and/or flips the output around a given center. |
| setAlpha | Sets the current alpha. |
| setFillAlpha | Sets the current fill alpha. |
| setStrokeAlpha | Sets the current stroke alpha. |
| setFillColor | Sets the current fill color. |
| setGradient | Sets the gradient. |
| setStrokeColor | Sets the current stroke color. |
| setStrokeWidth | Sets the current stroke width. |
| setDashed | Enables or disables dashed lines. |
| setDashPattern | Sets the current dash pattern. |
| setLineCap | Sets the line cap. |
| setLineJoin | Sets the line join. |
| setMiterLimit | Sets the miter limit. |
| setFontColor | Sets the current font color. |
| setFontBackgroundColor | Sets the current font background color. |
| setFontBorderColor | Sets the current font border color. |
| setFontSize | Sets the current font size. |
| setFontFamily | Sets the current font family. |
| setFontStyle | Sets the current font style. |
| setShadow | Enables or disables shadows. |
| setShadowColor | Sets the current shadow color. |
| setShadowAlpha | Sets the current shadows alpha. |
| setShadowOffset | Sets the current shadow offset. |
| rect | Puts a rectangle into the drawing buffer. |
| roundrect | Puts a rounded rectangle into the drawing buffer. |
| ellipse | Puts an ellipse into the drawing buffer. |
| image | Paints an image. |
| begin | Starts a new path and puts it into the drawing buffer. |
| moveTo | Moves the current path the given point. |
| lineTo | Draws a line to the given coordinates. |
| quadTo | Adds a quadratic curve to the current path. |
| curveTo | Adds a bezier curve to the current path. |
| close | Closes the current path. |
| text | Paints the given text. |
| stroke | Paints the outline of the current drawing buffer. |
| fill | Fills the current drawing buffer. |
| fillAndStroke | Fills the current drawing buffer and its outline. |
mxXmlCanvas2D.prototype.writeDefaults = function()
mxXmlCanvas2D.prototype.createElement = function( name )
Creates the given element using the owner document of root.
mxXmlCanvas2D.prototype.rotate = function( theta, flipH, flipV, cx, cy )
Rotates and/or flips the output around a given center. (Note: Due to limitations in VML, the rotation cannot be concatenated.)
| theta | Number that represents the angle of the rotation (in degrees). |
| flipH | Boolean indicating if the output should be flipped horizontally. |
| flipV | Boolean indicating if the output should be flipped vertically. |
| cx | Number that represents the x-coordinate of the rotation center. |
| cy | Number that represents the y-coordinate of the rotation center. |
mxXmlCanvas2D.prototype.setGradient = function( color1, color2, x, y, w, h, direction, alpha1, alpha2 )
Sets the gradient. Note that the coordinates may be ignored by some implementations.
| color1 | Hexadecimal representation of the start color. |
| color2 | Hexadecimal representation of the end color. |
| x | X-coordinate of the gradient region. |
| y | y-coordinate of the gradient region. |
| w | Width of the gradient region. |
| h | Height of the gradient region. |
| direction | One of mxConstants.DIRECTION_NORTH, mxConstants.DIRECTION_EAST, mxConstants.DIRECTION_SOUTH or mxConstants.DIRECTION_WEST. |
| alpha1 | Optional alpha of the start color. Default is 1. Possible values are between 1 (opaque) and 0 (transparent). |
| alpha2 | Optional alpha of the end color. Default is 1. Possible values are between 1 (opaque) and 0 (transparent). |
mxXmlCanvas2D.prototype.setDashPattern = function( value )
Sets the current dash pattern. Default is ‘3 3’.
| value | String that represents the dash pattern, which is a sequence of numbers defining the length of the dashes and the length of the spaces |
| between the dashes. The lengths are relative to the line width | a length of 1 is equals to the line width. |
mxXmlCanvas2D.prototype.setFontSize = function( value )
Sets the current font size. Default is mxConstants.DEFAULT_FONTSIZE.
| value | Numeric representation of the font size. |
mxXmlCanvas2D.prototype.setFontFamily = function( value )
Sets the current font family. Default is mxConstants.DEFAULT_FONTFAMILY.
| value | String representation of the font family. This handles the same values as the CSS font-family property. |
mxXmlCanvas2D.prototype.setFontStyle = function( value )
Sets the current font style.
| value | Numeric representation of the font family. This is the sum of the font styles from mxConstants. |
mxXmlCanvas2D.prototype.setShadowColor = function( value )
Sets the current shadow color. Default is mxConstants.SHADOWCOLOR.
| value | Hexadecimal representation of the color or ‘none’. |
mxXmlCanvas2D.prototype.setShadowAlpha = function( value )
Sets the current shadows alpha. Default is mxConstants.SHADOW_OPACITY.
| value | Number that represents the new alpha. Possible values are between 1 (opaque) and 0 (transparent). |
mxXmlCanvas2D.prototype.rect = function( x, y, w, h )
Puts a rectangle into the drawing buffer.
| x | Number that represents the x-coordinate of the rectangle. |
| y | Number that represents the y-coordinate of the rectangle. |
| w | Number that represents the width of the rectangle. |
| h | Number that represents the height of the rectangle. |
mxXmlCanvas2D.prototype.roundrect = function( x, y, w, h, dx, dy )
Puts a rounded rectangle into the drawing buffer.
| x | Number that represents the x-coordinate of the rectangle. |
| y | Number that represents the y-coordinate of the rectangle. |
| w | Number that represents the width of the rectangle. |
| h | Number that represents the height of the rectangle. |
| dx | Number that represents the horizontal rounding. |
| dy | Number that represents the vertical rounding. |
mxXmlCanvas2D.prototype.ellipse = function( x, y, w, h )
Puts an ellipse into the drawing buffer.
| x | Number that represents the x-coordinate of the ellipse. |
| y | Number that represents the y-coordinate of the ellipse. |
| w | Number that represents the width of the ellipse. |
| h | Number that represents the height of the ellipse. |
mxXmlCanvas2D.prototype.image = function( x, y, w, h, src, aspect, flipH, flipV )
Paints an image.
| x | Number that represents the x-coordinate of the image. |
| y | Number that represents the y-coordinate of the image. |
| w | Number that represents the width of the image. |
| h | Number that represents the height of the image. |
| src | String that specifies the URL of the image. |
| aspect | Boolean indicating if the aspect of the image should be preserved. |
| flipH | Boolean indicating if the image should be flipped horizontally. |
| flipV | Boolean indicating if the image should be flipped vertically. |
mxXmlCanvas2D.prototype.quadTo = function( x1, y1, x2, y2 )
Adds a quadratic curve to the current path.
| x1 | Number that represents the x-coordinate of the control point. |
| y1 | Number that represents the y-coordinate of the control point. |
| x2 | Number that represents the x-coordinate of the endpoint. |
| y2 | Number that represents the y-coordinate of the endpoint. |
mxXmlCanvas2D.prototype.curveTo = function( x1, y1, x2, y2, x3, y3 )
Adds a bezier curve to the current path.
| x1 | Number that represents the x-coordinate of the first control point. |
| y1 | Number that represents the y-coordinate of the first control point. |
| x2 | Number that represents the x-coordinate of the second control point. |
| y2 | Number that represents the y-coordinate of the second control point. |
| x3 | Number that represents the x-coordinate of the endpoint. |
| y3 | Number that represents the y-coordinate of the endpoint. |
mxXmlCanvas2D.prototype.text = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the given text. Possible values for format are empty string for plain text and html for HTML markup. Background and border color as well as clipping is not available in plain text labels for VML. HTML labels are not available as part of shapes with no foreignObject support in SVG (eg. IE9, IE10).
| x | Number that represents the x-coordinate of the text. |
| y | Number that represents the y-coordinate of the text. |
| w | Number that represents the available width for the text or 0 for automatic width. |
| h | Number that represents the available height for the text or 0 for automatic height. |
| str | String that specifies the text to be painted. |
| align | String that represents the horizontal alignment. |
| valign | String that represents the vertical alignment. |
| wrap | Boolean that specifies if word-wrapping is enabled. Requires w > 0. |
| format | Empty string for plain text or ‘html’ for HTML markup. |
| overflow | Specifies the overflow behaviour of the label. Requires w > 0 and/or h > 0. |
| clip | Boolean that specifies if the label should be clipped. Requires w > 0 and/or h > 0. |
| rotation | Number that specifies the angle of the rotation around the anchor point of the text. |
| dir | Optional string that specifies the text direction. Possible values are rtl and lrt. |
Extends mxAbstractCanvas2D to implement a canvas for SVG. This canvas writes all calls as SVG output to the given SVG root node.
var svgDoc = mxUtils.createXmlDocument();
var root = (svgDoc.createElementNS != null) ?
svgDoc.createElementNS(mxConstants.NS_SVG, 'svg') : svgDoc.createElement('svg');
if (svgDoc.createElementNS == null)
{
root.setAttribute('xmlns', mxConstants.NS_SVG);
root.setAttribute('xmlns:xlink', mxConstants.NS_XLINK);
}
else
{
root.setAttributeNS('http://www.w3.org/2000/xmlns/', 'xmlns:xlink', mxConstants.NS_XLINK);
}
var bounds = graph.getGraphBounds();
root.setAttribute('width', (bounds.x + bounds.width + 4) + 'px');
root.setAttribute('height', (bounds.y + bounds.height + 4) + 'px');
root.setAttribute('version', '1.1');
svgDoc.appendChild(root);
var svgCanvas = new mxSvgCanvas2D(root);A description of the public API is available in mxXmlCanvas2D.
To disable anti-aliasing in the output, use the following code.
graph.view.canvas.ownerSVGElement.setAttribute('shape-rendering', 'crispEdges');Or set the respective attribute in the SVG element directly.
| Functions | |
| mxSvgCanvas2D | Constructs a new SVG canvas. |
| Variables | |
| root | Reference to the container for the SVG content. |
| gradients | Local cache of gradients for quick lookups. |
| defs | Reference to the defs section of the SVG document. |
| styleEnabled | Stores the value of styleEnabled passed to the constructor. |
| path | Holds the current DOM node. |
| matchHtmlAlignment | Specifies if plain text output should match the vertical HTML alignment. |
| textEnabled | Specifies if text output should be enabled. |
| foEnabled | Specifies if use of foreignObject for HTML markup is allowed. |
| foAltText | Specifies the fallback text for unsupported foreignObjects in exported documents. |
| foOffset | Offset to be used for foreignObjects. |
| textOffset | Offset to be used for text elements. |
| imageOffset | Offset to be used for image elements. |
| strokeTolerance | Adds transparent paths for strokes. |
| minStrokeWidth | Minimum stroke width for output. |
| refCount | Local counter for references in SVG export. |
| blockImagePointerEvents | Specifies if a transparent rectangle should be added on top of images to absorb all pointer events. |
| lineHeightCorrection | Correction factor for mxConstants.LINE_HEIGHT in HTML output. |
| pointerEventsValue | Default value for active pointer events. |
| fontMetricsPadding | Padding to be added for text that is not wrapped to account for differences in font metrics on different platforms in pixels. |
| cacheOffsetSize | Specifies if offsetWidth and offsetHeight should be cached. |
| Functions | |
| format | Rounds all numbers to 2 decimal points. |
| getBaseUrl | Returns the URL of the page without the hash part. |
| reset | Returns any offsets for rendering pixels. |
| createStyle | Creates the optional style section. |
| createElement | Private helper function to create SVG elements |
| getAlternateContent | Returns the alternate content for the given foreignObject. |
| createGradientId | Private helper function to create SVG elements |
| getSvgGradient | Private helper function to create SVG elements |
| createSvgGradient | Creates the given SVG gradient. |
| addNode | Private helper function to create SVG elements |
| updateFill | Transfers the stroke attributes from <state> to <node>. |
| getCurrentStrokeWidth | Returns the current stroke width (>= 1), ie. |
| updateStroke | Transfers the stroke attributes from <state> to <node>. |
| updateStrokeAttributes | Transfers the stroke attributes from <state> to <node>. |
| createDashPattern | Creates the SVG dash pattern for the given state. |
| createTolerance | Creates a hit detection tolerance shape for the given node. |
| createShadow | Creates a shadow for the given node. |
| setLink | Experimental implementation for hyperlinks. |
| rotate | Sets the rotation of the canvas. |
| begin | Extends superclass to create path. |
| rect | Private helper function to create SVG elements |
| roundrect | Private helper function to create SVG elements |
| ellipse | Private helper function to create SVG elements |
| image | Private helper function to create SVG elements |
| convertHtml | Converts the given HTML string to XHTML. |
| createDiv | Private helper function to create SVG elements |
| text | Paints the given text. |
| createClip | Creates a clip for the given coordinates. |
| text | Paints the given text. |
| updateFont | Updates the text properties for the given node. |
| addTextBackground | Background color and border |
| stroke | Paints the outline of the current path. |
| fill | Fills the current path. |
| fillAndStroke | Fills and paints the outline of the current path. |
function mxSvgCanvas2D( root, styleEnabled )
Constructs a new SVG canvas.
| root | SVG container for the output. |
| styleEnabled | Optional boolean that specifies if a style section should be added. The style section sets the default font-size, font-family and stroke-miterlimit globally. Default is false. |
mxSvgCanvas2D.prototype.lineHeightCorrection
Correction factor for mxConstants.LINE_HEIGHT in HTML output. Default is 1.
mxSvgCanvas2D.prototype.getBaseUrl = function()
Returns the URL of the page without the hash part. This needs to use href to include any search part with no params (ie question mark alone). This is a workaround for the fact that window.location.search is empty if there is no search string behind the question mark.
mxSvgCanvas2D.prototype.text = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the given text. Possible values for format are empty string for plain text and html for HTML markup. Note that HTML markup is only supported if foreignObject is supported and foEnabled is true. (This means IE9 and later does currently not support HTML text as part of shapes.)
Implements a canvas to be used for rendering VML. Here is an example of implementing a fallback for SVG images which are not supported in VML-based browsers.
var mxVmlCanvas2DImage = mxVmlCanvas2D.prototype.image;
mxVmlCanvas2D.prototype.image = function(x, y, w, h, src, aspect, flipH, flipV)
{
if (src.substring(src.length - 4, src.length) == '.svg')
{
src = 'http://www.jgraph.com/images/mxgraph.gif';
}
mxVmlCanvas2DImage.apply(this, arguments);
};To disable anti-aliasing in the output, use the following code.
document.createStyleSheet().cssText = mxClient.VML_PREFIX + '\\:*{antialias:false;)}';A description of the public API is available in mxXmlCanvas2D. Note that there is a known issue in VML where gradients are painted using the outer bounding box of rotated shapes, not the actual bounds of the shape. See also text for plain text label restrictions in shapes for VML.
| Variables | |
| root | Reference to the container for the SVG content. |
| path | Holds the current DOM node. |
| textEnabled | Specifies if text output should be enabledetB. |
| moveOp | Contains the string used for moving in paths. |
| lineOp | Contains the string used for moving in paths. |
| curveOp | Contains the string used for bezier curves. |
| closeOp | Holds the operator for closing curves. |
| rotatedHtmlBackground | Background color for rotated HTML. |
| vmlScale | Specifies the scale used to draw VML shapes. |
| Functions | |
| createElement | Creates the given element using the document. |
| createVmlElement | Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX. |
| addNode | Adds the current node to the root. |
| createTransparentFill | Creates a transparent fill. |
| createFill | Creates a fill for the current state. |
| createStroke | Creates a fill for the current state. |
| getVmlDashPattern | Returns a VML dash pattern for the current dashPattern. |
| createShadow | Creates a shadow for the given node. |
| createShadowFill | Creates the fill for the shadow. |
| createShadowStroke | Creates the stroke for the shadow. |
| rotate | Sets the rotation of the canvas. |
| begin | Extends superclass to create path. |
| quadTo | Replaces quadratic curve with bezier curve in VML. |
| createRect | Sets the glass gradient. |
| rect | Sets the current path to a rectangle. |
| roundrect | Sets the current path to a rounded rectangle. |
| ellipse | Sets the current path to an ellipse. |
| image | Paints an image. |
| createText | Creates the innermost element that contains the HTML text. |
| text | Paints the given text. |
| plainText | Paints the outline of the current path. |
| stroke | Paints the outline of the current path. |
| fill | Fills the current path. |
| fillAndStroke | Fills and paints the outline of the current path. |
mxVmlCanvas2D.prototype.createVmlElement = function( name )
Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX.
mxVmlCanvas2D.prototype.addNode = function( filled, stroked )
Adds the current node to the root.
Returns a VML dash pattern for the current dashPattern. See http://msdn.microsoft.com/en-us/library/bb264085(v=vs.85).aspx
Implements the alignment of selection cells to other cells in the graph.
| Functions | |
| mxGuide | Constructs a new guide object. |
| Variables | |
| graph | Reference to the enclosing mxGraph instance. |
| states | Contains the mxCellStates that are used for alignment. |
| horizontal | Specifies if horizontal guides are enabled. |
| vertical | Specifies if vertical guides are enabled. |
| vertical | Holds the mxShape for the horizontal guide. |
| vertical | Holds the mxShape for the vertical guide. |
| rounded | Specifies if rounded coordinates should be used. |
| Functions | |
| setStates | Sets the mxCellStates that should be used for alignment. |
| isEnabledForEvent | Returns true if the guide should be enabled for the given native event. |
| getGuideTolerance | Returns the tolerance for the guides. |
| createGuideShape | Returns the mxShape to be used for painting the respective guide. |
| move | Moves the <bounds> by the given mxPoint and returnt the snapped point. |
| hide | Hides all current guides. |
| hide | Hides all current guides. |
| hide | Hides all current guides. |
| setVisible | Shows or hides the current guides. |
| destroy | Destroys all resources that this object uses. |
mxGuide.prototype.graph
Reference to the enclosing mxGraph instance.
mxGuide.prototype.states
Contains the mxCellStates that are used for alignment.
Holds the mxShape for the horizontal guide.
Holds the mxShape for the vertical guide.
mxGuide.prototype.setStates = function( states )
Sets the mxCellStates that should be used for alignment.
mxGuide.prototype.createGuideShape = function( horizontal )
Returns the mxShape to be used for painting the respective guide. This implementation returns a new, dashed and crisp mxPolyline using mxConstants.GUIDE_COLOR and mxConstants.GUIDE_STROKEWIDTH as the format.
| horizontal | Boolean that specifies which guide should be created. |
mxGuide.prototype.move = function( bounds, delta, gridEnabled, clone )
Moves the <bounds> by the given mxPoint and returnt the snapped point.
Base class for all shapes. A shape in mxGraph is a separate implementation for SVG, VML and HTML. Which implementation to use is controlled by the dialect property which is assigned from within the mxCellRenderer when the shape is created. The dialect must be assigned for a shape, and it does normally depend on the browser and the confiuration of the graph (see mxGraph rendering hint).
For each supported shape in SVG and VML, a corresponding shape exists in mxGraph, namely for text, image, rectangle, rhombus, ellipse and polyline. The other shapes are a combination of these shapes (eg. label and swimlane) or they consist of one or more (filled) path objects (eg. actor and cylinder). The HTML implementation is optional but may be required for a HTML-only view of the graph.
To extend from this class, the basic code looks as follows. In the special case where the custom shape consists only of one filled region or one filled region and an additional stroke the mxActor and mxCylinder should be subclassed, respectively.
function CustomShape() { }
CustomShape.prototype = new mxShape();
CustomShape.prototype.constructor = CustomShape;To register a custom shape in an existing graph instance, one must register the shape under a new name in the graph’s cell renderer as follows:
mxCellRenderer.registerShape('customShape', CustomShape);The second argument is the name of the constructor.
In order to use the shape you can refer to the given name above in a stylesheet. For example, to change the shape for the default vertex style, the following code is used:
var style = graph.getStylesheet().getDefaultVertexStyle(); style[mxConstants.STYLE_SHAPE] = 'customShape';
| Functions | |
| mxShape | Constructs a new shape. |
| Variables | |
| dialect | Holds the dialect in which the shape is to be painted. |
| scale | Holds the scale in which the shape is being painted. |
| antiAlias | Rendering hint for configuring the canvas. |
| minSvgStrokeWidth | Minimum stroke width for SVG output. |
| bounds | Holds the mxRectangle that specifies the bounds of this shape. |
| points | Holds the array of mxPoints that specify the points of this shape. |
| node | Holds the outermost DOM node that represents this shape. |
| state | Optional reference to the corresponding mxCellState. |
| style | Optional reference to the style of the corresponding mxCellState. |
| boundingBox | Contains the bounding box of the shape, that is, the smallest rectangle that includes all pixels of the shape. |
| stencil | Holds the mxStencil that defines the shape. |
| svgStrokeTolerance | Event-tolerance for SVG strokes (in px). |
| pointerEvents | Specifies if pointer events should be handled. |
| svgPointerEvents | Specifies if pointer events should be handled. |
| shapePointerEvents | Specifies if pointer events outside of shape should be handled. |
| stencilPointerEvents | Specifies if pointer events outside of stencils should be handled. |
| vmlScale | Scale for improving the precision of VML rendering. |
| outline | Specifies if the shape should be drawn as an outline. |
| visible | Specifies if the shape is visible. |
| useSvgBoundingBox | Allows to use the SVG bounding box in SVG. |
| Functions | |
| init | Initializes the shape by creaing the DOM node using create and adding it into the given container. |
| initStyles | Sets the styles to their default values. |
| isParseVml | Specifies if any VML should be added via insertAdjacentHtml to the DOM. |
| isHtmlAllowed | Returns true if HTML is allowed for this shape. |
| getSvgScreenOffset | Returns 0, or 0.5 if <strokewidth> % 2 == 1. |
| create | Creates and returns the DOM node(s) for the shape in the given container. |
| createSvg | Creates and returns the SVG node(s) to represent this shape. |
| createVml | Creates and returns the VML node to represent this shape. |
| createHtml | Creates and returns the HTML DOM node(s) to represent this shape. |
| reconfigure | Reconfigures this shape. |
| redraw | Creates and returns the SVG node(s) to represent this shape. |
| clear | Removes all child nodes and resets all CSS. |
| updateBoundsFromPoints | Updates the bounds based on the points. |
| getLabelBounds | Returns the mxRectangle for the label bounds of this shape, based on the given scaled and translated bounds of the shape. |
| getLabelMargins | Returns the scaled top, left, bottom and right margin to be used for computing the label bounds as an mxRectangle, where the bottom and right margin are defined in the width and height of the rectangle, respectively. |
| checkBounds | Returns true if the bounds are not null and all of its variables are numeric. |
| createVmlGroup | Returns the temporary element used for rendering in IE8 standards mode. |
| redrawShape | Updates the SVG or VML shape. |
| createCanvas | Creates a new canvas for drawing this shape. |
| createSvgCanvas | Creates and returns an mxSvgCanvas2D for rendering this shape. |
| createVmlCanvas | Creates and returns an mxVmlCanvas2D for rendering this shape. |
| updateVmlContainer | Updates the bounds of the VML container. |
| redrawHtml | Allow optimization by replacing VML with HTML. |
| updateHtmlFilters | Allow optimization by replacing VML with HTML. |
| mixedModeHtml | Allow optimization by replacing VML with HTML. |
| mixedModeHtml | Allow optimization by replacing VML with HTML. |
| destroyCanvas | Destroys the given canvas which was used for drawing. |
| paint | Generic rendering code. |
| configureCanvas | Sets the state of the canvas for drawing the shape. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| updateTransform | Sets the scale and rotation on the given canvas. |
| paintVertexShape | Paints the vertex shape. |
| paintBackground | Hook for subclassers. |
| paintForeground | Hook for subclassers. |
| paintEdgeShape | Hook for subclassers. |
| getArcSize | Returns the arc size for the given dimension. |
| paintGlassEffect | Paints the glass gradient effect. |
| addPoints | Paints the given points with rounded corners. |
| resetStyles | Resets all styles. |
| apply | Applies the style of the given mxCellState to the shape. |
| setCursor | Sets the cursor on the given shape. |
| getCursor | Returns the current cursor. |
| isRoundable | Hook for subclassers. |
| updateBoundingBox | Updates the boundingBox for this shape using createBoundingBox and augmentBoundingBox and stores the result in boundingBox. |
| createBoundingBox | Returns a new rectangle that represents the bounding box of the bare shape with no shadows or strokewidths. |
| augmentBoundingBox | Augments the bounding box with the strokewidth and shadow offsets. |
| isPaintBoundsInverted | Returns true if the bounds should be inverted. |
| getRotation | Returns the rotation from the style. |
| getTextRotation | Returns the rotation for the text label. |
| getShapeRotation | Returns the actual rotation of the shape. |
| createTransparentSvgRectangle | Adds a transparent rectangle that catches all events. |
| setTransparentBackgroundImage | Sets a transparent background CSS style to catch all events. |
| releaseSvgGradients | Paints the line shape. |
| destroy | Destroys the shape by removing it from the DOM and releasing the DOM node associated with the shape using mxEvent.release. |
mxShape.prototype.dialect
Holds the dialect in which the shape is to be painted. This can be one of the DIALECT constants in mxConstants.
mxShape.prototype.bounds
Holds the mxRectangle that specifies the bounds of this shape.
mxShape.prototype.points
Holds the array of mxPoints that specify the points of this shape.
mxShape.prototype.state
Optional reference to the corresponding mxCellState.
mxShape.prototype.style
Optional reference to the style of the corresponding mxCellState.
mxShape.prototype.stencil
Holds the mxStencil that defines the shape.
mxShape.prototype.svgStrokeTolerance
Event-tolerance for SVG strokes (in px). Default is 8. This is only passed to the canvas in createSvgCanvas if pointerEvents is true.
mxShape.prototype.outline
Specifies if the shape should be drawn as an outline. This disables all fill colors and can be used to disable other drawing states that should not be painted for outlines. Default is false. This should be set before calling apply.
mxShape.prototype.init = function( container )
Initializes the shape by creaing the DOM node using create and adding it into the given container.
| container | DOM node that will contain the shape. |
mxShape.prototype.create = function( container )
Creates and returns the DOM node(s) for the shape in the given container. This implementation invokes createSvg, createHtml or createVml depending on the dialect and style settings.
| container | DOM node that will contain the shape. |
mxShape.prototype.createHtml = function()
Creates and returns the HTML DOM node(s) to represent this shape. This implementation falls back to createVml so that the HTML creation is optional.
mxShape.prototype.getLabelBounds = function( rect )
Returns the mxRectangle for the label bounds of this shape, based on the given scaled and translated bounds of the shape. This method should not change the rectangle in-place. This implementation returns the given rect.
mxShape.prototype.getLabelMargins= function( rect )
Returns the scaled top, left, bottom and right margin to be used for computing the label bounds as an mxRectangle, where the bottom and right margin are defined in the width and height of the rectangle, respectively.
mxShape.prototype.createSvgCanvas = function()
Creates and returns an mxSvgCanvas2D for rendering this shape.
mxShape.prototype.createVmlCanvas = function()
Creates and returns an mxVmlCanvas2D for rendering this shape.
mxShape.prototype.apply = function( state )
Applies the style of the given mxCellState to the shape. This implementation assigns the following styles to local fields:
This keeps a reference to the style. If you need to keep a reference to the cell, you can override this method and store a local reference to state.cell or the mxCellState itself. If outline should be true, make sure to set it before calling this method.
| state | mxCellState of the corresponding cell. |
mxShape.prototype.updateBoundingBox = function()
Updates the boundingBox for this shape using createBoundingBox and augmentBoundingBox and stores the result in boundingBox.
mxShape.prototype.destroy = function()
Destroys the shape by removing it from the DOM and releasing the DOM node associated with the shape using mxEvent.release.
Implements a generic shape which is based on a XML node as a description.
If you want to define specific fixed connection points on the shape use the connections element. Each constraint element within connections defines a fixed connection point on the shape. Constraints have attributes:
The path of the graphics drawing is split into two elements, foreground and background. The split is to define which part any shadow applied to the shape is derived from (the background). This, generally, means the background is the line tracing of the outside of the shape, but not always.
Any stroke, fill or fillstroke of a background must be the first element of the foreground element, they must not be used within background. If the background is empty, this is not required.
Because the background cannot have any fill or stroke, it can contain only one path, rect, roundrect or ellipse element (or none). It can also not include image, text or include-shape.
Note that the state, styling and drawing in mxGraph stencils is very close in design to that of HTML 5 canvas. Tutorials on this subject, if you’re not familiar with the topic, will give a good high-level introduction to the concepts used.
Rendering within the foreground and background elements has the concept of state. There are two types of operations other than state save/load, styling and drawing. The styling operations change the current state, so you can save the current state with <save/> and pull the last saved state from the state stack using <restore/>.
The elements that change colors within the current state all take a hash prefixed hex color code (“#FFEA80”).
alpha defines the degree of transparency used between 1.0 for fully opaque and 0.0 for fully transparent.
fillalpha defines the degree of fill transparency used between 1.0 for fully opaque and 0.0 for fully transparent.
strokealpha defines the degree of stroke transparency used between 1.0 for fully opaque and 0.0 for fully transparent.
strokewidth defines the integer thickness of drawing elements rendered by stroking. Use fixed=”1” to apply the value as-is, without scaling.
dashed is “1” for dashing enabled and “0” for disabled.
When dashed is enabled the current dash pattern, defined by dashpattern, is used on strokes. dashpattern is a sequence of space separated “on, off” lengths that define what distance to paint the stroke for, then what distance to paint nothing for, repeat... The default is “3 3”. You could define a more complex pattern with “5 3 2 6”, for example. Generally, it makes sense to have an even number of elements in the dashpattern, but that’s not required.
linejoin, linecap and miterlimit are best explained by the Mozilla page on Canvas styling (about halfway down). The values are all the same except we use “flat” for linecap, instead of Canvas’ “butt”.
For font styling there are.
Most drawing is contained within a path element. Again, the graphic primitives are very similar to that of HTML 5 canvas.
In addition to the graphics primitive operations there are non-primitive operations. These provide an easy method to draw some basic shapes.
Note that these 3 shapes and all paths must be followed by either a fill, stroke, or fillstroke.
text elements have the following attributes.
If allowEval is true, then the text content of the this element can define a function which is invoked with the shape as the only argument and returns the value for the text element (ignored if the str attribute is not null).
image elements can either be external URLs, or data URIs, where supported (not in IE 7-). Attributes are:
If allowEval is true, then the text content of the this element can define a function which is invoked with the shape as the only argument and returns the value for the image source (ignored if the src attribute is not null).
include-shape allow stencils to be rendered within the current stencil by referencing the sub-stencil by name. Attributes are:
| Functions | |
| mxStencil | Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints. |
| Variables | |
| defaultLocalized | Static global variable that specifies the default value for the localized attribute of the text element. |
| Functions | |
| allowEval | Static global switch that specifies if the use of eval is allowed for evaluating text content and images. |
| Variables | |
| desc | Holds the XML node with the stencil description. |
| constraints | Holds an array of mxConnectionConstraints as defined in the shape. |
| aspect | Holds the aspect of the shape. |
| w0 | Holds the width of the shape. |
| h0 | Holds the height of the shape. |
| bgNodes | Holds the XML node with the stencil description. |
| fgNodes | Holds the XML node with the stencil description. |
| strokewidth | Holds the strokewidth direction from the description. |
| Functions | |
| parseDescription | Reads w0, h0, aspect, bgNodes and fgNodes from desc. |
| parseConstraints | Reads the constraints from desc into constraints using parseConstraint. |
| parseConstraint | Parses the given XML node and returns its mxConnectionConstraint. |
| evaluateTextAttribute | Gets the given attribute as a text. |
| evaluateAttribute | Gets the attribute for the given name from the given node. |
| drawShape | Draws this stencil inside the given bounds. |
| drawChildren | Draws this stencil inside the given bounds. |
| computeAspect | Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle. |
| drawNode | Draws this stencil inside the given bounds. |
function mxStencil( desc )
Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints.
| desc | XML node that contains the stencil description. |
mxStencil.prototype.constraints
Holds an array of mxConnectionConstraints as defined in the shape.
mxStencil.prototype.parseConstraints = function()
Reads the constraints from desc into constraints using parseConstraint.
mxStencil.prototype.parseConstraint = function( node )
Parses the given XML node and returns its mxConnectionConstraint.
mxStencil.prototype.evaluateTextAttribute = function( node, attribute, shape )
Gets the given attribute as a text. The return value from evaluateAttribute is used as a key to mxResources.get if the localized attribute in the text node is 1 or if defaultLocalized is true.
mxStencil.prototype.evaluateAttribute = function( node, attribute, shape )
Gets the attribute for the given name from the given node. If the attribute does not exist then the text content of the node is evaluated and if it is a function it is invoked with <shape> as the only argument and the return value is used as the attribute value to be returned.
mxStencil.prototype.computeAspect = function( shape, x, y, w, h, direction )
Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle.
| shape | mxShape to be drawn. |
| bounds | mxRectangle that should contain the stencil. |
| direction | Optional direction of the shape to be darwn. |
A singleton class that provides a registry for stencils and the methods for painting those stencils onto a canvas or into a DOM.
| Functions | |
| addStencil | Adds the given mxStencil. |
| getStencil | Returns the mxStencil for the given name. |
addStencil: function( name, stencil )
Adds the given mxStencil.
getStencil: function( name )
Returns the mxStencil for the given name.
A static class that implements all markers for VML and SVG using a registry. NOTE: The signatures in this class will change.
| Variables | |
| markers | Maps from markers names to functions to paint the markers. |
| Functions | |
| addMarker | Adds a factory method that updates a given endpoint and returns a function to paint the marker onto the given canvas. |
| createMarker | Returns a function to paint the given marker. |
Extends mxShape to implement an actor shape. If a custom shape with one filled area is needed, then this shape’s redrawPath should be overridden.
function SampleShape() { }
SampleShape.prototype = new mxActor();
SampleShape.prototype.constructor = vsAseShape;
mxCellRenderer.registerShape('sample', SampleShape);
SampleShape.prototype.redrawPath = function(path, x, y, w, h)
{
path.moveTo(0, 0);
path.lineTo(w, h);
// ...
path.close();
}This shape is registered under mxConstants.SHAPE_ACTOR in mxCellRenderer.
| Functions | |
| mxActor | Constructs a new actor shape. |
| paintVertexShape | Redirects to redrawPath for subclasses to work. |
| redrawPath | Draws the path for this shape. |
function mxActor( bounds, fill, stroke, strokewidth )
Constructs a new actor shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxActor to implement a cloud shape.
This shape is registered under mxConstants.SHAPE_CLOUD in mxCellRenderer.
| Functions | |
| mxCloud | Constructs a new cloud shape. |
| redrawPath | Draws the path for this shape. |
function mxCloud( bounds, fill, stroke, strokewidth )
Constructs a new cloud shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement a rectangle shape. This shape is registered under mxConstants.SHAPE_RECTANGLE in mxCellRenderer.
| Functions | |
| mxRectangleShape | Constructs a new rectangle shape. |
| isHtmlAllowed | Returns true for non-rounded, non-rotated shapes with no glass gradient. |
| paintBackground | Generic background painting implementation. |
| isRoundable | Adds roundable support. |
| paintForeground | Generic background painting implementation. |
function mxRectangleShape( bounds, fill, stroke, strokewidth )
Constructs a new rectangle shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement an ellipse shape. This shape is registered under mxConstants.SHAPE_ELLIPSE in mxCellRenderer.
| Functions | |
| mxEllipse | Constructs a new ellipse shape. |
| paintVertexShape | Paints the ellipse shape. |
function mxEllipse( bounds, fill, stroke, strokewidth )
Constructs a new ellipse shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement a double ellipse shape. This shape is registered under mxConstants.SHAPE_DOUBLE_ELLIPSE in mxCellRenderer. Use the following override to only fill the inner ellipse in this shape:
mxDoubleEllipse.prototype.paintVertexShape = function(c, x, y, w, h)
{
c.ellipse(x, y, w, h);
c.stroke();
var inset = mxUtils.getValue(this.style, mxConstants.STYLE_MARGIN, Math.min(3 + this.strokewidth, Math.min(w / 5, h / 5)));
x += inset;
y += inset;
w -= 2 * inset;
h -= 2 * inset;
if (w > 0 && h > 0)
{
c.ellipse(x, y, w, h);
}
c.fillAndStroke();
};| Functions | |
| mxDoubleEllipse | Constructs a new ellipse shape. |
| Variables | |
| vmlScale | Scale for improving the precision of VML rendering. |
| Functions | |
| paintBackground | Paints the background. |
| paintForeground | Paints the foreground. |
| getLabelBounds | Returns the bounds for the label. |
function mxDoubleEllipse( bounds, fill, stroke, strokewidth )
Constructs a new ellipse shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement a rhombus (aka diamond) shape. This shape is registered under mxConstants.SHAPE_RHOMBUS in mxCellRenderer.
| Functions | |
| mxRhombus | Constructs a new rhombus shape. |
| isRoundable | Adds roundable support. |
| paintVertexShape | Generic painting implementation. |
function mxRhombus( bounds, fill, stroke, strokewidth )
Constructs a new rhombus shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement a polyline (a line with multiple points). This shape is registered under <mxConstants.SHAPE_POLYLINE> in mxCellRenderer.
| Functions | |
| mxPolyline | Constructs a new polyline shape. |
| getRotation | Returns 0. |
| getShapeRotation | Returns 0. |
| isPaintBoundsInverted | Returns false. |
| paintEdgeShape | Paints the line shape. |
| paintLine | Paints the line shape. |
| paintLine | Paints the line shape. |
function mxPolyline( points, stroke, strokewidth )
Constructs a new polyline shape.
| points | Array of mxPoints that define the points. This is stored in mxShape.points. |
| stroke | String that defines the stroke color. Default is ‘black’. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement an arrow shape. (The shape is used to represent edges, not vertices.) This shape is registered under mxConstants.SHAPE_ARROW in mxCellRenderer.
| Functions | |
| mxArrow | Constructs a new arrow shape. |
| augmentBoundingBox | Augments the bounding box with the edge width and markers. |
| paintEdgeShape | Paints the line shape. |
function mxArrow( points, fill, stroke, strokewidth, arrowWidth, spacing, endSize )
Constructs a new arrow shape.
| points | Array of mxPoints that define the points. This is stored in mxShape.points. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
| arrowWidth | Optional integer that defines the arrow width. Default is mxConstants.ARROW_WIDTH. This is stored in <arrowWidth>. |
| spacing | Optional integer that defines the spacing between the arrow shape and its endpoints. Default is mxConstants.ARROW_SPACING. This is stored in <spacing>. |
| endSize | Optional integer that defines the size of the arrowhead. Default is mxConstants.ARROW_SIZE. This is stored in <endSize>. |
Extends mxShape to implement an new rounded arrow shape with support for waypoints and double arrows. (The shape is used to represent edges, not vertices.) This shape is registered under mxConstants.SHAPE_ARROW_CONNECTOR in mxCellRenderer.
| Functions | |
| mxArrowConnector | Constructs a new arrow shape. |
| Variables | |
| useSvgBoundingBox | Allows to use the SVG bounding box in SVG. |
| resetStyles | Overrides mxShape to reset spacing. |
| Functions | |
| augmentBoundingBox | Augments the bounding box with the edge width and markers. |
| paintEdgeShape | Paints the line shape. |
| paintEdgeShape | Paints the line shape. |
| isArrowRounded | Returns wether the arrow is rounded |
| getStartArrowWidth | Returns the width of the start arrow |
| getEndArrowWidth | Returns the width of the end arrow |
| getEdgeWidth | Returns the width of the body of the edge |
| isOpenEnded | Returns whether the ends of the shape are drawn |
| isMarkerStart | Returns whether the start marker is drawn |
| isMarkerEnd | Returns whether the end marker is drawn |
function mxArrowConnector( points, fill, stroke, strokewidth, arrowWidth, spacing, endSize )
Constructs a new arrow shape.
| points | Array of mxPoints that define the points. This is stored in mxShape.points. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
| arrowWidth | Optional integer that defines the arrow width. Default is mxConstants.ARROW_WIDTH. This is stored in <arrowWidth>. |
| spacing | Optional integer that defines the spacing between the arrow shape and its endpoints. Default is mxConstants.ARROW_SPACING. This is stored in <spacing>. |
| endSize | Optional integer that defines the size of the arrowhead. Default is mxConstants.ARROW_SIZE. This is stored in <endSize>. |
Extends mxShape to implement a text shape. To change vertical text from bottom to top to top to bottom, the following code can be used:
mxText.prototype.verticalTextRotation = 90;
| Functions | |
| mxText | Constructs a new text shape. |
| Variables | |
| baseSpacingTop | Specifies the spacing to be added to the top spacing. |
| baseSpacingBottom | Specifies the spacing to be added to the bottom spacing. |
| baseSpacingLeft | Specifies the spacing to be added to the left spacing. |
| baseSpacingRight | Specifies the spacing to be added to the right spacing. |
| replaceLinefeeds | Specifies if linefeeds in HTML labels should be replaced with BR tags. |
| verticalTextRotation | Rotation for vertical text. |
| ignoreClippedStringSize | Specifies if the string size should be measured in updateBoundingBox if the label is clipped and the label position is center and middle. |
| ignoreStringSize | Specifies if the actual string size should be measured. |
| textWidthPadding | Specifies the padding to be added to the text width for the bounding box. |
| lastValue | Contains the last rendered text value. |
| cacheEnabled | Specifies if caching for HTML labels should be enabled. |
| Functions | |
| isParseVml | Text shapes do not contain VML markup and do not need to be parsed. |
| isHtmlAllowed | Returns true if HTML is allowed for this shape. |
| getSvgScreenOffset | Disables offset in IE9 for crisper image output. |
| checkBounds | Returns true if the bounds are not null and all of its variables are numeric. |
| paint | Generic rendering code. |
| redraw | Renders the text using the given DOM nodes. |
| resetStyles | Resets all styles. |
| apply | Extends mxShape to update the text styles. |
| getAutoDirection | Used to determine the automatic text direction. |
| updateBoundingBox | Updates the <boundingBox> for this shape using the given node and position. |
| getShapeRotation | Returns 0 to avoid using rotation in the canvas via updateTransform. |
| getTextRotation | Returns the rotation for the text label of the corresponding shape. |
| isPaintBoundsInverted | Inverts the bounds if <mxShape.isBoundsInverted> returns true or if the horizontal style is false. |
| configureCanvas | Sets the state of the canvas for drawing the shape. |
| updateVmlContainer | Sets the width and height of the container to 1px. |
| redrawHtmlShape | Updates the HTML node(s) to reflect the latest bounds and scale. |
| updateHtmlTransform | Returns the spacing as an mxPoint. |
| setInnerHtml | Sets the inner HTML of the given element to the <value>. |
| updateHtmlFilter | Rotated text rendering quality is bad for IE9 quirks/IE8 standards |
| updateValue | Updates the HTML node(s) to reflect the latest bounds and scale. |
| updateFont | Updates the HTML node(s) to reflect the latest bounds and scale. |
| updateSize | Updates the HTML node(s) to reflect the latest bounds and scale. |
| getMargin | Returns the spacing as an mxPoint. |
| getSpacing | Returns the spacing as an mxPoint. |
function mxText( value, bounds, align, valign, color, family, size, fontStyle, spacing, spacingTop, spacingRight, spacingBottom, spacingLeft, horizontal, background, border, wrap, clipped, overflow, labelPadding, textDirection )
Constructs a new text shape.
| value | String that represents the text to be displayed. This is stored in <value>. |
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| align | Specifies the horizontal alignment. Default is ‘’. This is stored in <align>. |
| valign | Specifies the vertical alignment. Default is ‘’. This is stored in <valign>. |
| color | String that specifies the text color. Default is ‘black’. This is stored in <color>. |
| family | String that specifies the font family. Default is mxConstants.DEFAULT_FONTFAMILY. This is stored in <family>. |
| size | Integer that specifies the font size. Default is mxConstants.DEFAULT_FONTSIZE. This is stored in <size>. |
| fontStyle | Specifies the font style. Default is 0. This is stored in <fontStyle>. |
| spacing | Integer that specifies the global spacing. Default is 2. This is stored in <spacing>. |
| spacingTop | Integer that specifies the top spacing. Default is 0. The sum of the spacing and this is stored in <spacingTop>. |
| spacingRight | Integer that specifies the right spacing. Default is 0. The sum of the spacing and this is stored in <spacingRight>. |
| spacingBottom | Integer that specifies the bottom spacing. Default is 0.The sum of the spacing and this is stored in <spacingBottom>. |
| spacingLeft | Integer that specifies the left spacing. Default is 0. The sum of the spacing and this is stored in <spacingLeft>. |
| horizontal | Boolean that specifies if the label is horizontal. Default is true. This is stored in <horizontal>. |
| background | String that specifies the background color. Default is null. This is stored in <background>. |
| border | String that specifies the label border color. Default is null. This is stored in <border>. |
| wrap | Specifies if word-wrapping should be enabled. Default is false. This is stored in <wrap>. |
| clipped | Specifies if the label should be clipped. Default is false. This is stored in <clipped>. |
| overflow | Value of the overflow style. Default is ‘visible’. |
mxText.prototype.ignoreClippedStringSize
Specifies if the string size should be measured in updateBoundingBox if the label is clipped and the label position is center and middle. If this is true, then the bounding box will be set to <bounds>. Default is true. ignoreStringSize has precedence over this switch.
mxText.prototype.apply = function( state )
Extends mxShape to update the text styles.
| state | mxCellState of the corresponding cell. |
mxText.prototype.getAutoDirection = function()
Used to determine the automatic text direction. Returns mxConstants.TEXT_DIRECTION_LTR or mxConstants.TEXT_DIRECTION_RTL depending on the contents of <value>. This is not invoked for HTML, wrapped content or if <value> is a DOM node.
mxText.prototype.updateHtmlTransform = function()
Returns the spacing as an mxPoint.
Returns the spacing as an mxPoint.
mxText.prototype.getSpacing = function()
Returns the spacing as an mxPoint.
Implementation of the triangle shape.
| Functions | |
| mxTriangle | Constructs a new triangle shape. |
| isRoundable | Adds roundable support. |
| redrawPath | Draws the path for this shape. |
Implementation of the hexagon shape.
| Functions | |
| mxHexagon | Constructs a new hexagon shape. |
| redrawPath | Draws the path for this shape. |
Extends mxShape to implement a horizontal line shape. This shape is registered under mxConstants.SHAPE_LINE in mxCellRenderer.
| Functions | |
| mxLine | Constructs a new line shape. |
| paintVertexShape | Redirects to redrawPath for subclasses to work. |
function mxLine( bounds, stroke, strokewidth )
Constructs a new line shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| stroke | String that defines the stroke color. Default is ‘black’. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement an image shape. This shape is registered under mxConstants.SHAPE_IMAGE in mxCellRenderer.
| Functions | |
| mxImageShape | Constructs a new image shape. |
| Variables | |
| preserveImageAspect | Switch to preserve image aspect. |
| Functions | |
| getSvgScreenOffset | Disables offset in IE9 for crisper image output. |
| apply | Overrides mxShape.apply to replace the fill and stroke colors with the respective values from mxConstants.STYLE_IMAGE_BACKGROUND and mxConstants.STYLE_IMAGE_BORDER. |
| isHtmlAllowed | Returns true if HTML is allowed for this shape. |
| createHtml | Creates and returns the HTML DOM node(s) to represent this shape. |
| isRoundable | Disables inherited roundable support. |
| paintVertexShape | Generic background painting implementation. |
| redraw | Overrides mxShape.redraw to preserve the aspect ratio of images. |
function mxImageShape( bounds, image, fill, stroke, strokewidth )
Constructs a new image shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| image | String that specifies the URL of the image. This is stored in <image>. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 0. This is stored in <strokewidth>. |
mxImageShape.prototype.apply = function( state )
Overrides mxShape.apply to replace the fill and stroke colors with the respective values from mxConstants.STYLE_IMAGE_BACKGROUND and mxConstants.STYLE_IMAGE_BORDER.
Applies the style of the given mxCellState to the shape. This implementation assigns the following styles to local fields:
| state | mxCellState of the corresponding cell. |
mxImageShape.prototype.redrawHtmlShape = function()
Overrides mxShape.redraw to preserve the aspect ratio of images.
Extends mxShape to implement an image shape with a label. This shape is registered under mxConstants.SHAPE_LABEL in mxCellRenderer.
| Functions | |
| mxLabel | Constructs a new label shape. |
| Variables | |
| imageSize | Default width and height for the image. |
| spacing | Default value for image spacing. |
| indicatorSize | Default width and height for the indicicator. |
| indicatorSpacing | Default spacing between image and indicator. |
| Functions | |
| init | Initializes the shape and the <indicator>. |
| redraw | Reconfigures this shape. |
| isHtmlAllowed | Returns true for non-rounded, non-rotated shapes with no glass gradient and no indicator shape. |
| paintForeground | Generic background painting implementation. |
| paintImage | Generic background painting implementation. |
| getImageBounds | Generic background painting implementation. |
| paintIndicator | Generic background painting implementation. |
| getIndicatorBounds | Generic background painting implementation. |
| redrawHtmlShape | Generic background painting implementation. |
function mxLabel( bounds, fill, stroke, strokewidth )
Constructs a new label shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
mxLabel.prototype.imageSize
Default width and height for the image. Default is mxConstants.DEFAULT_IMAGESIZE.
Extends mxShape to implement an cylinder shape. If a custom shape with one filled area and an overlay path is needed, then this shape’s redrawPath should be overridden. This shape is registered under mxConstants.SHAPE_CYLINDER in mxCellRenderer.
| Functions | |
| mxCylinder | Constructs a new cylinder shape. |
| Variables | |
| maxHeight | Defines the maximum height of the top and bottom part of the cylinder shape. |
| svgStrokeTolerance | Sets stroke tolerance to 0 for SVG. |
| Functions | |
| paintVertexShape | Redirects to redrawPath for subclasses to work. |
| redrawPath | Draws the path for this shape. |
| redrawPath | Draws the path for this shape. |
function mxCylinder( bounds, fill, stroke, strokewidth )
Constructs a new cylinder shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Extends mxShape to implement a connector shape. The connector shape allows for arrow heads on either side.
This shape is registered under mxConstants.SHAPE_CONNECTOR in mxCellRenderer.
| Functions | |
| mxConnector | Constructs a new connector shape. |
| updateBoundingBox | Updates the <boundingBox> for this shape using <createBoundingBox> and augmentBoundingBox and stores the result in <boundingBox>. |
| paintEdgeShape | Paints the line shape. |
| createMarker | Prepares the marker by adding offsets in pts and returning a function to paint the marker. |
| augmentBoundingBox | Augments the bounding box with the strokewidth and shadow offsets. |
function mxConnector( points, stroke, strokewidth )
Constructs a new connector shape.
| points | Array of mxPoints that define the points. This is stored in mxShape.points. |
| stroke | String that defines the stroke color. This is stored in <stroke>. Default is ‘black’. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
mxConnector.prototype.updateBoundingBox = function()
Updates the <boundingBox> for this shape using <createBoundingBox> and augmentBoundingBox and stores the result in <boundingBox>.
Extends mxShape to implement a swimlane shape. This shape is registered under mxConstants.SHAPE_SWIMLANE in mxCellRenderer. Use the <mxConstants.STYLE_STYLE_STARTSIZE> to define the size of the title region, mxConstants.STYLE_SWIMLANE_FILLCOLOR for the content area fill, mxConstants.STYLE_SEPARATORCOLOR to draw an additional vertical separator and mxConstants.STYLE_SWIMLANE_LINE to hide the line between the title region and the content area. The mxConstants.STYLE_HORIZONTAL affects the orientation of this shape, not only its label.
| Functions | |
| mxSwimlane | Constructs a new swimlane shape. |
| Variables | |
| imageSize | Default imagewidth and imageheight if an image but no imagewidth and imageheight are defined in the style. |
| Functions | |
| isRoundable | Adds roundable support. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| getGradientBounds | Returns the bounding box for the gradient box for this shape. |
| getArcSize | Returns the arcsize for the swimlane. |
| paintVertexShape | Paints the swimlane vertex shape. |
| paintVertexShape | Paints the swimlane vertex shape. |
| paintSwimlane | Paints the swimlane vertex shape. |
| paintRoundedSwimlane | Paints the swimlane vertex shape. |
| paintDivider | Paints the divider between swimlane title and content area. |
| paintSeparator | Paints the vertical or horizontal separator line between swimlanes. |
| getImageBounds | Paints the swimlane vertex shape. |
function mxSwimlane( bounds, fill, stroke, strokewidth )
Constructs a new swimlane shape.
| bounds | mxRectangle that defines the bounds. This is stored in mxShape.bounds. |
| fill | String that defines the fill color. This is stored in <fill>. |
| stroke | String that defines the stroke color. This is stored in <stroke>. |
| strokewidth | Optional integer that defines the stroke width. Default is 1. This is stored in <strokewidth>. |
Base class for all layout algorithms in mxGraph. Main public functions are <move> for handling a moved cell within a layouted parent, and execute for running the layout on a given parent cell.
mxCircleLayout, mxCompactTreeLayout, mxCompositeLayout, mxFastOrganicLayout, mxParallelEdgeLayout, mxPartitionLayout, mxStackLayout
| Functions | |
| mxGraphLayout | Constructs a new layout using the given layouts. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| useBoundingBox | Boolean indicating if the bounding box of the label should be used if its available. |
| parent | The parent cell of the layout, if any |
| Functions | |
| moveCell | Notified when a cell is being moved in a parent that has automatic layout to update the cell state (eg. |
| execute | Executes the layout algorithm for the children of the given parent. |
| getGraph | Returns the graph that this layout operates on. |
| getConstraint | Returns the constraint for the given key and cell. |
| traverse | Traverses the (directed) graph invoking the given function for each visited vertex and edge. |
| isAncestor | Returns true if the given parent is an ancestor of the given child. |
| isVertexMovable | Returns a boolean indicating if the given mxCell is movable or bendable by the algorithm. |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored by the algorithm. |
| isEdgeIgnored | Returns a boolean indicating if the given mxCell should be ignored by the algorithm. |
| setEdgeStyleEnabled | Disables or enables the edge style of the given edge. |
| setOrthogonalEdge | Disables or enables orthogonal end segments of the given edge. |
| getParentOffset | Determines the offset of the given parent to the parent of the layout |
| setEdgePoints | Replaces the array of mxPoints in the geometry of the given edge with the given array of mxPoints. |
| setVertexLocation | Sets the new position of the given cell taking into account the size of the bounding box if useBoundingBox is true. |
| getVertexBounds | Returns an mxRectangle that defines the bounds of the given cell or the bounding box if useBoundingBox is true. |
| arrangeGroups | Shortcut to mxGraph.updateGroupBounds with moveGroup set to true. |
mxGraphLayout.prototype.graph
Reference to the enclosing mxGraph.
mxGraphLayout.prototype.moveCell = function( cell, x, y )
Notified when a cell is being moved in a parent that has automatic layout to update the cell state (eg. index) so that the outcome of the layout will position the vertex as close to the point (x, y) as possible.
Empty implementation.
| cell | mxCell which has been moved. |
| x | X-coordinate of the new cell location. |
| y | Y-coordinate of the new cell location. |
mxGraphLayout.prototype.execute = function( parent )
Executes the layout algorithm for the children of the given parent.
| parent | mxCell whose children should be layed out. |
mxGraphLayout.prototype.getConstraint = function( key, cell, edge, source )
Returns the constraint for the given key and cell. The optional edge and source arguments are used to return inbound and outgoing routing- constraints for the given edge and vertex. This implementation always returns the value for the given key in the style of the given cell.
| key | Key of the constraint to be returned. |
| cell | mxCell whose constraint should be returned. |
| edge | Optional mxCell that represents the connection whose constraint should be returned. Default is null. |
| source | Optional boolean that specifies if the connection is incoming or outgoing. Default is null. |
mxGraphLayout.traverse = function( vertex, directed, func, edge, visited )
Traverses the (directed) graph invoking the given function for each visited vertex and edge. The function is invoked with the current vertex and the incoming edge as a parameter. This implementation makes sure each vertex is only visited once. The function may return false if the traversal should stop at the given vertex.
mxLog.show();
var cell = graph.getSelectionCell();
graph.traverse(cell, false, function(vertex, edge)
{
mxLog.debug(graph.getLabel(vertex));
});| vertex | mxCell that represents the vertex where the traversal starts. |
| directed | Optional boolean indicating if edges should only be traversed from source to target. Default is true. |
| func | Visitor function that takes the current vertex and the incoming edge as arguments. The traversal stops if the function returns false. |
| edge | Optional mxCell that represents the incoming edge. This is null for the first step of the traversal. |
| visited | Optional mxDictionary of cell paths for the visited cells. |
mxGraphLayout.prototype.setVertexLocation = function( cell, x, y )
Sets the new position of the given cell taking into account the size of the bounding box if useBoundingBox is true. The change is only carried out if the new location is not equal to the existing location, otherwise the geometry is not replaced with an updated instance. The new or old bounds are returned (including overlapping labels).
| cell | mxCell whose geometry is to be set. |
| x | Integer that defines the x-coordinate of the new location. |
| y | Integer that defines the y-coordinate of the new location. |
mxGraphLayout.prototype.getVertexBounds = function( cell )
Returns an mxRectangle that defines the bounds of the given cell or the bounding box if useBoundingBox is true.
mxGraphLayout.prototype.arrangeGroups = function( cells, border, topBorder, rightBorder, bottomBorder, leftBorder )
Shortcut to mxGraph.updateGroupBounds with moveGroup set to true.
A utility class used to track cells whilst sorting occurs on the weighted sum of their connected edges. Does not violate (x.compareTo(y)==0) == (x.equals(y))
| Functions | |
| WeightedCellSorter | Constructs a new weighted cell sorted for the given cell and weight. |
| Variables | |
| weightedValue | The weighted value of the cell stored. |
| nudge | Whether or not to flip equal weight values. |
| visited | Whether or not this cell has been visited in the current assignment. |
| rankIndex | The index this cell is in the model rank. |
| cell | The cell whose median value is being calculated. |
| Functions | |
| compare | Compares two WeightedCellSorters. |
Extends mxGraphLayout to create a horizontal or vertical stack of the child vertices. The children do not need to be connected for this layout to work.
var layout = new mxStackLayout(graph, true); layout.execute(graph.getDefaultParent());
| Functions | |
| mxStackLayout | Constructs a new stack layout layout for the specified graph, spacing, orientation and offset. |
| Variables | |
| horizontal | Specifies the orientation of the layout. |
| spacing | Specifies the spacing between the cells. |
| x0 | Specifies the horizontal origin of the layout. |
| y0 | Specifies the vertical origin of the layout. |
| border | Border to be added if fill is true. |
| marginTop | Top margin for the child area. |
| marginLeft | Top margin for the child area. |
| marginRight | Top margin for the child area. |
| marginBottom | Top margin for the child area. |
| keepFirstLocation | Boolean indicating if the location of the first cell should be kept, that is, it will not be moved to x0 or y0. |
| fill | Boolean indicating if dimension should be changed to fill out the parent cell. |
| resizeParent | If the parent should be resized to match the width/height of the stack. |
| resizeParentMax | Use maximum of existing value and new value for resize of parent. |
| resizeLast | If the last element should be resized to fill out the parent. |
| wrap | Value at which a new column or row should be created. |
| borderCollapse | If the strokeWidth should be ignored. |
| allowGaps | If gaps should be allowed in the stack. |
| gridSize | Grid size for alignment of position and size. |
| Functions | |
| isHorizontal | Returns horizontal. |
| moveCell | Implements mxGraphLayout.moveCell. |
| getParentSize | Returns the size for the parent container or the size of the graph container if the parent is a layer or the root of the model. |
| getLayoutCells | Returns the cells to be layouted. |
| snap | Snaps the given value to the grid size. |
| execute | Implements mxGraphLayout.execute. |
| execute | Implements mxGraphLayout.execute. |
| execute | Implements mxGraphLayout.execute. |
mxStackLayout.prototype.resizeLast
If the last element should be resized to fill out the parent. Default is false. If resizeParent is true then this is ignored.
mxStackLayout.prototype.isHorizontal = function()
Returns horizontal.
mxStackLayout.prototype.moveCell = function( cell, x, y )
Implements mxGraphLayout.moveCell.
mxStackLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute.
Only children where <isVertexIgnored> returns false are taken into account.
Implements mxGraphLayout.execute.
Only children where <isVertexIgnored> returns false are taken into account.
Implements mxGraphLayout.execute.
Only children where <isVertexIgnored> returns false are taken into account.
Extends mxGraphLayout for partitioning the parent cell vertically or horizontally by filling the complete area with the child cells. A horizontal layout partitions the height of the given parent whereas a a non-horizontal layout partitions the width. If the parent is a layer (that is, a child of the root node), then the current graph size is partitioned. The children do not need to be connected for this layout to work.
var layout = new mxPartitionLayout(graph, true, 10, 20); layout.execute(graph.getDefaultParent());
| Functions | |
| mxPartitionLayout | Constructs a new stack layout layout for the specified graph, spacing, orientation and offset. |
| Variables | |
| horizontal | Boolean indicating the direction in which the space is partitioned. |
| spacing | Integer that specifies the absolute spacing in pixels between the children. |
| border | Integer that specifies the absolute inset in pixels for the parent that contains the children. |
| resizeVertices | Boolean that specifies if vertices should be resized. |
| Functions | |
| isHorizontal | Returns horizontal. |
| moveCell | Implements mxGraphLayout.moveCell. |
| execute | Implements mxGraphLayout.execute. |
mxPartitionLayout.prototype.isHorizontal = function()
Returns horizontal.
mxPartitionLayout.prototype.moveCell = function( cell, x, y )
Implements mxGraphLayout.moveCell.
mxPartitionLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute. All children where <isVertexIgnored> returns false and <isVertexMovable> returns true are modified.
Extends mxGraphLayout to implement a compact tree (Moen) algorithm. This layout is suitable for graphs that have no cycles (trees). Vertices that are not connected to the tree will be ignored by this layout.
var layout = new mxCompactTreeLayout(graph); layout.execute(graph.getDefaultParent());
| Functions | |
| mxCompactTreeLayout | Constructs a new compact tree layout for the specified graph and orientation. |
| Variables | |
| horizontal | Specifies the orientation of the layout. |
| invert | Specifies if edge directions should be inverted. |
| resizeParent | If the parents should be resized to match the width/height of the children. |
| maintainParentLocation | Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout. |
| groupPadding | Padding added to resized parents. |
| groupPaddingTop | Top padding added to resized parents. |
| groupPaddingRight | Right padding added to resized parents. |
| groupPaddingBottom | Bottom padding added to resized parents. |
| groupPaddingLeft | Left padding added to resized parents. |
| parentsChanged | A set of the parents that need updating based on children process as part of the layout. |
| moveTree | Specifies if the tree should be moved to the top, left corner if it is inside a top-level layer. |
| visited | Specifies if the tree should be moved to the top, left corner if it is inside a top-level layer. |
| levelDistance | Holds the levelDistance. |
| nodeDistance | Holds the nodeDistance. |
| resetEdges | Specifies if all edge points of traversed edges should be removed. |
| prefHozEdgeSep | The preferred horizontal distance between edges exiting a vertex. |
| prefVertEdgeOff | The preferred vertical offset between edges exiting a vertex. |
| minEdgeJetty | The minimum distance for an edge jetty from a vertex. |
| channelBuffer | The size of the vertical buffer in the center of inter-rank channels where edge control points should not be placed. |
| edgeRouting | Whether or not to apply the internal tree edge routing. |
| sortEdges | Specifies if edges should be sorted according to the order of their opposite terminal cell in the model. |
| alignRanks | Whether or not the tops of cells in each rank should be aligned across the rank |
| maxRankHeight | An array of the maximum height of cells (relative to the layout direction) per rank |
| root | The cell to use as the root of the tree |
| node | The internal node representation of the root cell. |
| Functions | |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored as a vertex. |
| isHorizontal | Returns horizontal. |
| execute | Implements mxGraphLayout.execute. |
| moveNode | Moves the specified node and all of its children by the given amount. |
| sortOutgoingEdges | Called if sortEdges is true to sort the array of outgoing edges in place. |
| findRankHeights | Stores the maximum height (relative to the layout direction) of cells in each rank |
| setCellHeights | Set the cells heights (relative to the layout direction) when the tops of each rank are to be aligned |
| dfs | Does a depth first search starting at the specified cell. |
| layout | Starts the actual compact tree layout algorithm at the given node. |
| horizontalLayout | |
| verticalLayout | |
| attachParent | |
| layoutLeaf | |
| join | |
| merge | |
| offset | |
| bridge | |
| createNode | |
| apply | |
| createLine | |
| adjustParents | Adjust parent cells whose child geometries have changed. |
| localEdgeProcessing | Moves the specified node and all of its children by the given amount. |
| localEdgeProcessing | Separates the x position of edges as they connect to vertices |
mxCompactTreeLayout.prototype.isHorizontal = function()
Returns horizontal.
mxCompactTreeLayout.prototype.execute = function( parent, root )
Implements mxGraphLayout.execute.
If the parent has any connected edges, then it is used as the root of the tree. Else, mxGraph.findTreeRoots will be used to find a suitable root node within the set of children of the given parent.
| parent | mxCell whose children should be laid out. |
| root | Optional mxCell that will be used as the root of the tree. Overrides root if specified. |
mxCompactTreeLayout.prototype.sortOutgoingEdges = function( source, edges )
Called if sortEdges is true to sort the array of outgoing edges in place.
Extends mxGraphLayout to implement a radial tree algorithm. This layout is suitable for graphs that have no cycles (trees). Vertices that are not connected to the tree will be ignored by this layout.
var layout = new mxRadialTreeLayout(graph); layout.execute(graph.getDefaultParent());
| Functions | |
| mxRadialTreeLayout | Constructs a new radial tree layout for the specified graph |
| Variables | |
| angleOffset | The initial offset to compute the angle position. |
| rootx | The X co-ordinate of the root cell |
| rooty | The Y co-ordinate of the root cell |
| levelDistance | Holds the levelDistance. |
| nodeDistance | Holds the nodeDistance. |
| autoRadius | Specifies if the radios should be computed automatically |
| sortEdges | Specifies if edges should be sorted according to the order of their opposite terminal cell in the model. |
| rowMinX | Array of leftmost x coordinate of each row |
| rowMaxX | Array of rightmost x coordinate of each row |
| rowMinCenX | Array of x coordinate of leftmost vertex of each row |
| rowMaxCenX | Array of x coordinate of rightmost vertex of each row |
| rowRadi | Array of y deltas of each row behind root vertex, also the radius in the tree |
| row | Array of vertices on each row |
| Functions | |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored as a vertex. |
| execute | Implements mxGraphLayout.execute. |
| calcRowDims | Recursive function to calculate the dimensions of each row |
mxRadialTreeLayout.prototype.execute = function( parent, root )
Implements mxGraphLayout.execute.
If the parent has any connected edges, then it is used as the root of the tree. Else, mxGraph.findTreeRoots will be used to find a suitable root node within the set of children of the given parent.
| parent | mxCell whose children should be laid out. |
| root | Optional mxCell that will be used as the root of the tree. |
Extends mxGraphLayout to implement a fast organic layout algorithm. The vertices need to be connected for this layout to work, vertices with no connections are ignored.
var layout = new mxFastOrganicLayout(graph); layout.execute(graph.getDefaultParent());
| Functions | |
| mxCompactTreeLayout | Constructs a new fast organic layout for the specified graph. |
| Variables | |
| useInputOrigin | Specifies if the top left corner of the input cells should be the origin of the layout result. |
| resetEdges | Specifies if all edge points of traversed edges should be removed. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| forceConstant | The force constant by which the attractive forces are divided and the replusive forces are multiple by the square of. |
| forceConstantSquared | Cache of <forceConstant>^2 for performance. |
| minDistanceLimit | Minimal distance limit. |
| minDistanceLimit | Minimal distance limit. |
| minDistanceLimitSquared | Cached version of minDistanceLimit squared. |
| initialTemp | Start value of temperature. |
| temperature | Temperature to limit displacement at later stages of layout. |
| maxIterations | Total number of iterations to run the layout though. |
| iteration | Current iteration count. |
| vertexArray | An array of all vertices to be laid out. |
| dispX | An array of locally stored X co-ordinate displacements for the vertices. |
| dispY | An array of locally stored Y co-ordinate displacements for the vertices. |
| cellLocation | An array of locally stored co-ordinate positions for the vertices. |
| radius | The approximate radius of each cell, nodes only. |
| radiusSquared | The approximate radius squared of each cell, nodes only. |
| isMoveable | Array of booleans representing the movable states of the vertices. |
| neighbours | Local copy of cell neighbours. |
| indices | Hashtable from cells to local indices. |
| allowedToRun | Boolean flag that specifies if the layout is allowed to run. |
| Functions | |
| isVertexIgnored | Returns a boolean indicating if the given mxCell should be ignored as a vertex. |
| execute | Implements mxGraphLayout.execute. |
| calcPositions | Takes the displacements calculated for each cell and applies them to the local cache of cell positions. |
| calcAttraction | Calculates the attractive forces between all laid out nodes linked by edges |
| calcRepulsion | Calculates the repulsive forces between all laid out nodes |
| reduceTemperature | Reduces the temperature of the layout from an initial setting in a linear fashion to zero. |
mxFastOrganicLayout.prototype.minDistanceLimitSquared
Cached version of minDistanceLimit squared.
mxFastOrganicLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute. This operates on all children of the given parent where isVertexIgnored returns false.
Extends mxGraphLayout to implement a circluar layout for a given radius. The vertices do not need to be connected for this layout to work and all connections between vertices are not taken into account.
var layout = new mxCircleLayout(graph); layout.execute(graph.getDefaultParent());
| Functions | |
| mxCircleLayout | Constructs a new circular layout for the specified radius. |
| Variables | |
| radius | Integer specifying the size of the radius. |
| moveCircle | Boolean specifying if the circle should be moved to the top, left corner specified by x0 and y0. |
| x0 | Integer specifying the left coordinate of the circle. |
| y0 | Integer specifying the top coordinate of the circle. |
| resetEdges | Specifies if all edge points of traversed edges should be removed. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| Functions | |
| execute | Implements mxGraphLayout.execute. |
| getRadius | Returns the radius to be used for the given vertex count. |
| circle | Executes the circular layout for the specified array of vertices and the given radius. |
function mxCircleLayout( graph, radius )
Constructs a new circular layout for the specified radius.
| graph | mxGraph that contains the cells. |
| radius | Optional radius as an int. Default is 100. |
mxCircleLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute.
mxCircleLayout.prototype.circle = function( vertices, r, left, top )
Executes the circular layout for the specified array of vertices and the given radius. This is called from execute.
Extends mxGraphLayout for arranging parallel edges. This layout works on edges for all pairs of vertices where there is more than one edge connecting the latter.
var layout = new mxParallelEdgeLayout(graph); layout.execute(graph.getDefaultParent());
To run the layout for the parallel edges of a changed edge only, the following code can be used.
var layout = new mxParallelEdgeLayout(graph);
graph.addListener(mxEvent.CELL_CONNECTED, function(sender, evt)
{
var model = graph.getModel();
var edge = evt.getProperty('edge');
var src = model.getTerminal(edge, true);
var trg = model.getTerminal(edge, false);
layout.isEdgeIgnored = function(edge2)
{
var src2 = model.getTerminal(edge2, true);
var trg2 = model.getTerminal(edge2, false);
return !(model.isEdge(edge2) && ((src == src2 && trg == trg2) || (src == trg2 && trg == src2)));
};
layout.execute(graph.getDefaultParent());
});| Functions | |
| mxCompactTreeLayout | Constructs a new fast organic layout for the specified graph. |
| Variables | |
| spacing | Defines the spacing between the parallels. |
| Functions | |
| execute | Implements mxGraphLayout.execute. |
| findParallels | Finds the parallel edges in the given parent. |
| getEdgeId | Returns a unique ID for the given edge. |
| layout | Lays out the parallel edges in the given array. |
| route | Routes the given edge via the given point. |
mxParallelEdgeLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute.
Allows to compose multiple layouts into a single layout. The master layout is the layout that handles move operations if another layout than the first element in layouts should be used. The <master> layout is not executed as the code assumes that it is part of layouts.
var first = new mxFastOrganicLayout(graph); var second = new mxParallelEdgeLayout(graph); var layout = new mxCompositeLayout(graph, [first, second], first); layout.execute(graph.getDefaultParent());
| Functions | |
| mxCompositeLayout | Constructs a new layout using the given layouts. |
| Variables | |
| layouts | Holds the array of mxGraphLayouts that this layout contains. |
| layouts | Reference to the mxGraphLayouts that handles moves. |
| Functions | |
| moveCell | Implements mxGraphLayout.moveCell by calling move on <master> or the first layout in layouts. |
| execute | Implements mxGraphLayout.execute by executing all layouts in a single transaction. |
function mxCompositeLayout( graph, layouts, master )
Constructs a new layout using the given layouts. The graph instance is required for creating the transaction that contains all layouts.
| graph | Reference to the enclosing mxGraph. |
| layouts | Array of mxGraphLayouts. |
| master | Optional layout that handles moves. If no layout is given then the first layout of the above array is used to handle moves. |
mxCompositeLayout.prototype.layouts
Holds the array of mxGraphLayouts that this layout contains.
Reference to the mxGraphLayouts that handles moves. If this is null then the first layout in layouts is used.
mxCompositeLayout.prototype.moveCell = function( cell, x, y )
Implements mxGraphLayout.moveCell by calling move on <master> or the first layout in layouts.
mxCompositeLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute by executing all layouts in a single transaction.
Extends mxGraphLayout to implement an edge label layout. This layout makes use of cell states, which means the graph must be validated in a graph view (so that the label bounds are available) before this layout can be executed.
var layout = new mxEdgeLabelLayout(graph); layout.execute(graph.getDefaultParent());
| Functions | |
| mxEdgeLabelLayout | Constructs a new edge label layout. |
| execute | Implements mxGraphLayout.execute. |
| placeLabels | Places the labels of the given edges. |
| avoid | Places the labels of the given edges. |
function mxEdgeLabelLayout( graph, radius )
Constructs a new edge label layout.
| graph | mxGraph that contains the cells. |
mxEdgeLabelLayout.prototype.execute = function( parent )
Implements mxGraphLayout.execute.
An abstraction of an internal hierarchy node or edge
| Functions | |
| mxGraphAbstractHierarchyCell | Constructs a new hierarchical layout algorithm. |
| Variables | |
| maxRank | The maximum rank this cell occupies. |
| minRank | The minimum rank this cell occupies. |
| x | The x position of this cell for each layer it occupies |
| y | The y position of this cell for each layer it occupies |
| width | The width of this cell |
| height | The height of this cell |
| nextLayerConnectedCells | A cached version of the cells this cell connects to on the next layer up |
| previousLayerConnectedCells | A cached version of the cells this cell connects to on the next layer down |
| temp | Temporary variable for general use. |
| Functions | |
| getNextLayerConnectedCells | Returns the cells this cell connects to on the next layer up |
| getPreviousLayerConnectedCells | Returns the cells this cell connects to on the next layer down |
| isEdge | Returns whether or not this cell is an edge |
| isVertex | Returns whether or not this cell is a node |
| getGeneralPurposeVariable | Gets the value of temp for the specified layer |
| setGeneralPurposeVariable | Set the value of temp for the specified layer |
| setX | Set the value of x for the specified layer |
| getX | Gets the value of x on the specified layer |
| setY | Set the value of y for the specified layer |
function mxGraphAbstractHierarchyCell()
Constructs a new hierarchical layout algorithm.
| graph | Reference to the enclosing mxGraph. |
| deterministic | Optional boolean that specifies if this layout should be deterministic. Default is true. |
mxGraphAbstractHierarchyCell.prototype.temp
Temporary variable for general use. Generally, try to avoid carrying information between stages. Currently, the longest path layering sets temp to the rank position in fixRanks() and the crossing reduction uses this. This meant temp couldn’t be used for hashing the nodes in the model dfs and so hashCode was created
An abstraction of a hierarchical edge for the hierarchy layout
| Functions | |
| mxGraphHierarchyNode | Constructs an internal node to represent the specified real graph cell |
| Variables | |
| cell | The graph cell this object represents. |
| id | The object identity of the wrapped cell |
| connectsAsTarget | Collection of hierarchy edges that have this node as a target |
| connectsAsSource | Collection of hierarchy edges that have this node as a source |
| hashCode | Assigns a unique hashcode for each node. |
| Functions | |
| getRankValue | Returns the integer value of the layer that this node resides in |
| getNextLayerConnectedCells | Returns the cells this cell connects to on the next layer up |
| getPreviousLayerConnectedCells | Returns the cells this cell connects to on the next layer down |
| isVertex | Returns true. |
| getGeneralPurposeVariable | Gets the value of temp for the specified layer |
| setGeneralPurposeVariable | Set the value of temp for the specified layer |
| isAncestor | |
| getCoreCell | Gets the core vertex associated with this wrapper |
An abstraction of a hierarchical edge for the hierarchy layout
| Functions | |
| mxGraphHierarchyEdge | Constructs a hierarchy edge |
| Variables | |
| edges | The graph edge(s) this object represents. |
| ids | The object identities of the wrapped cells |
| source | The node this edge is sourced at |
| target | The node this edge targets |
| isReversed | Whether or not the direction of this edge has been reversed internally to create a DAG for the hierarchical layout |
| Functions | |
| invert | Inverts the direction of this internal edge(s) |
| getNextLayerConnectedCells | Returns the cells this cell connects to on the next layer up |
| getPreviousLayerConnectedCells | Returns the cells this cell connects to on the next layer down |
| isEdge | Returns true. |
| getGeneralPurposeVariable | Gets the value of temp for the specified layer |
| setGeneralPurposeVariable | Set the value of temp for the specified layer |
| getCoreCell | Gets the first core edge associated with this wrapper |
Internal model of a hierarchical graph. This model stores nodes and edges equivalent to the real graph nodes and edges, but also stores the rank of the cells, the order within the ranks and the new candidate locations of cells. The internal model also reverses edge direction were appropriate , ignores self-loop and groups parallels together under one edge object.
| Functions | |
| mxGraphHierarchyModel | Creates an internal ordered graph model using the vertices passed in. |
| Variables | |
| maxRank | Stores the largest rank number allocated |
| vertexMapper | Map from graph vertices to internal model nodes. |
| edgeMapper | Map from graph edges to internal model edges |
| ranks | Mapping from rank number to actual rank |
| roots | Store of roots of this hierarchy model, these are real graph cells, not internal cells |
| parent | The parent cell whose children are being laid out |
| dfsCount | Count of the number of times the ancestor dfs has been used. |
| SOURCESCANSTARTRANK | High value to start source layering scan rank value from. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| Functions | |
| createInternalCells | Creates all edges in the internal model |
| initialRank | Basic determination of minimum layer ranking by working from from sources or sinks and working through each node in the relevant edge direction. |
| fixRanks | Fixes the layer assignments to the values stored in the nodes. |
| visit | A depth first search through the internal heirarchy model. |
| dfs | Performs a depth first search on the internal hierarchy model |
| extendedDfs | Performs a depth first search on the internal hierarchy model. |
function mxGraphHierarchyModel( layout, vertices, roots, parent, tightenToSource )
Creates an internal ordered graph model using the vertices passed in. If there are any, leftward edge need to be inverted in the internal model
| graph | the facade describing the graph to be operated on |
| vertices | the vertices for this hierarchy |
| ordered | whether or not the vertices are already ordered |
| deterministic | whether or not this layout should be deterministic on each |
| tightenToSource | whether or not to tighten vertices towards the sources |
| scanRanksFromSinks | Whether rank assignment is from the sinks or sources. usage |
mxGraphHierarchyModel.prototype.createInternalCells = function( layout, vertices, internalVertices )
Creates all edges in the internal model
| layout | Reference to the mxHierarchicalLayout algorithm. |
| vertices | Array of mxCells that represent the vertices whom are to have an internal representation created. |
| internalVertices | The array of mxGraphHierarchyNodes to have their information filled in using the real vertices. |
mxGraphHierarchyModel.prototype.visit = function( visitor, dfsRoots, trackAncestors, seenNodes )
A depth first search through the internal heirarchy model.
| visitor | The visitor function pattern to be called for each node. |
| trackAncestors | Whether or not the search is to keep track all nodes directly above this one in the search path. |
mxGraphHierarchyModel.prototype.dfs = function( parent, root, connectingEdge, visitor, seen, layer )
Performs a depth first search on the internal hierarchy model
| parent | the parent internal node of the current internal node |
| root | the current internal node |
| connectingEdge | the internal edge connecting the internal node and the parent internal node, if any |
| visitor | the visitor pattern to be called for each node |
| seen | a set of all nodes seen by this dfs a set of all of the ancestor node of the current node |
| layer | the layer on the dfs tree ( not the same as the model ranks ) |
mxGraphHierarchyModel.prototype.extendedDfs = function( parent, root, connectingEdge, visitor, seen, ancestors, childHash, layer )
Performs a depth first search on the internal hierarchy model. This dfs extends the default version by keeping track of cells ancestors, but it should be only used when necessary because of it can be computationally intensive for deep searches.
| parent | the parent internal node of the current internal node |
| root | the current internal node |
| connectingEdge | the internal edge connecting the internal node and the parent internal node, if any |
| visitor | the visitor pattern to be called for each node |
| seen | a set of all nodes seen by this dfs |
| ancestors | the parent hash code |
| childHash | the new hash code for this node |
| layer | the layer on the dfs tree ( not the same as the model ranks ) |
Internal model of a hierarchical graph. This model stores nodes and edges equivalent to the real graph nodes and edges, but also stores the rank of the cells, the order within the ranks and the new candidate locations of cells. The internal model also reverses edge direction were appropriate , ignores self-loop and groups parallels together under one edge object.
| Functions | |
| mxSwimlaneModel | Creates an internal ordered graph model using the vertices passed in. |
| Variables | |
| maxRank | Stores the largest rank number allocated |
| vertexMapper | Map from graph vertices to internal model nodes. |
| edgeMapper | Map from graph edges to internal model edges |
| ranks | Mapping from rank number to actual rank |
| roots | Store of roots of this hierarchy model, these are real graph cells, not internal cells |
| parent | The parent cell whose children are being laid out |
| dfsCount | Count of the number of times the ancestor dfs has been used. |
| SOURCESCANSTARTRANK | High value to start source layering scan rank value from. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| ranksPerGroup | An array of the number of ranks within each swimlane |
| Functions | |
| createInternalCells | Creates all edges in the internal model |
| initialRank | Basic determination of minimum layer ranking by working from from sources or sinks and working through each node in the relevant edge direction. |
| maxChainDfs | Performs a depth first search on the internal hierarchy model. |
| fixRanks | Fixes the layer assignments to the values stored in the nodes. |
| visit | A depth first search through the internal heirarchy model. |
| dfs | Performs a depth first search on the internal hierarchy model |
| extendedDfs | Performs a depth first search on the internal hierarchy model. |
function mxSwimlaneModel( layout, vertices, roots, parent, tightenToSource )
Creates an internal ordered graph model using the vertices passed in. If there are any, leftward edge need to be inverted in the internal model
| graph | the facade describing the graph to be operated on |
| vertices | the vertices for this hierarchy |
| ordered | whether or not the vertices are already ordered |
| deterministic | whether or not this layout should be deterministic on each |
| tightenToSource | whether or not to tighten vertices towards the sources |
| scanRanksFromSinks | Whether rank assignment is from the sinks or sources. usage |
mxSwimlaneModel.prototype.createInternalCells = function( layout, vertices, internalVertices )
Creates all edges in the internal model
| layout | Reference to the mxHierarchicalLayout algorithm. |
| vertices | Array of mxCells that represent the vertices whom are to have an internal representation created. |
| internalVertices | The array of mxGraphHierarchyNodes to have their information filled in using the real vertices. |
mxSwimlaneModel.prototype.maxChainDfs = function( parent, root, connectingEdge, seen, chainCount )
Performs a depth first search on the internal hierarchy model. This dfs extends the default version by keeping track of chains within groups. Any cycles should be removed prior to running, but previously seen cells are ignored.
| parent | the parent internal node of the current internal node |
| root | the current internal node |
| connectingEdge | the internal edge connecting the internal node and the parent internal node, if any |
| seen | a set of all nodes seen by this dfs |
| chainCount | the number of edges in the chain of vertices going through the current swimlane |
mxSwimlaneModel.prototype.visit = function( visitor, dfsRoots, trackAncestors, seenNodes )
A depth first search through the internal heirarchy model.
| visitor | The visitor function pattern to be called for each node. |
| trackAncestors | Whether or not the search is to keep track all nodes directly above this one in the search path. |
mxSwimlaneModel.prototype.dfs = function( parent, root, connectingEdge, visitor, seen, layer )
Performs a depth first search on the internal hierarchy model
| parent | the parent internal node of the current internal node |
| root | the current internal node |
| connectingEdge | the internal edge connecting the internal node and the parent internal node, if any |
| visitor | the visitor pattern to be called for each node |
| seen | a set of all nodes seen by this dfs a set of all of the ancestor node of the current node |
| layer | the layer on the dfs tree ( not the same as the model ranks ) |
mxSwimlaneModel.prototype.extendedDfs = function( parent, root, connectingEdge, visitor, seen, ancestors, childHash, layer )
Performs a depth first search on the internal hierarchy model. This dfs extends the default version by keeping track of cells ancestors, but it should be only used when necessary because of it can be computationally intensive for deep searches.
| parent | the parent internal node of the current internal node |
| root | the current internal node |
| connectingEdge | the internal edge connecting the internal node and the parent internal node, if any |
| visitor | the visitor pattern to be called for each node |
| seen | a set of all nodes seen by this dfs |
| ancestors | the parent hash code |
| childHash | the new hash code for this node |
| layer | the layer on the dfs tree ( not the same as the model ranks ) |
The specific layout interface for hierarchical layouts. It adds a <code>run</code> method with a parameter for the hierarchical layout model that is shared between the layout stages.
| Functions | |
| mxHierarchicalLayoutStage | Constructs a new hierarchical layout stage. |
| execute | Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use. |
Sets the horizontal locations of node and edge dummy nodes on each layer. Uses median down and up weighings as well heuristic to straighten edges as far as possible.
| Functions | |
| mxMedianHybridCrossingReduction | Creates a coordinate assignment. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| maxIterations | The maximum number of iterations to perform whilst reducing edge crossings. |
| nestedBestRanks | Stores each rank as a collection of cells in the best order found for each layer so far |
| currentBestCrossings | The total number of crossings found in the best configuration so far |
| iterationsWithoutImprovement | The total number of crossings found in the best configuration so far |
| maxNoImprovementIterations | The total number of crossings found in the best configuration so far |
| Functions | |
| execute | Performs a vertex ordering within ranks as described by Gansner et al 1993 |
| calculateCrossings | Calculates the total number of edge crossing in the current graph. |
| calculateRankCrossing | Calculates the number of edges crossings between the specified rank and the rank below it. |
| transpose | Takes each possible adjacent cell pair on each rank and checks if swapping them around reduces the number of crossing |
| weightedMedian | Sweeps up or down the layout attempting to minimise the median placement of connected cells on adjacent ranks |
| medianRank | Attempts to minimise the median placement of connected cells on this rank and one of the adjacent ranks |
| medianValue | Calculates the median rank order positioning for the specified cell using the connected cells on the specified rank. |
function mxMedianHybridCrossingReduction( layout )
Creates a coordinate assignment.
| intraCellSpacing | the minimum buffer between cells on the same rank |
| interRankCellSpacing | the minimum distance between cells on adjacent ranks |
| orientation | the position of the root node(s) relative to the graph |
| initialX | the leftmost coordinate node placement starts at |
mxMedianHybridCrossingReduction.prototype.layout
Reference to the enclosing mxHierarchicalLayout.
mxMedianHybridCrossingReduction.prototype.calculateCrossings = function( model )
Calculates the total number of edge crossing in the current graph. Returns the current number of edge crossings in the hierarchy graph model in the current candidate layout
| model | the internal model describing the hierarchy |
mxMedianHybridCrossingReduction.prototype.calculateRankCrossing = function( i, model )
Calculates the number of edges crossings between the specified rank and the rank below it. Returns the number of edges crossings with the rank beneath
| i | the topmost rank of the pair ( higher rank value ) |
| model | the internal model describing the hierarchy |
mxMedianHybridCrossingReduction.prototype.transpose = function( mainLoopIteration, model )
Takes each possible adjacent cell pair on each rank and checks if swapping them around reduces the number of crossing
| mainLoopIteration | the iteration number of the main loop |
| model | the internal model describing the hierarchy |
mxMedianHybridCrossingReduction.prototype.weightedMedian = function( iteration, model )
Sweeps up or down the layout attempting to minimise the median placement of connected cells on adjacent ranks
| iteration | the iteration number of the main loop |
| model | the internal model describing the hierarchy |
mxMedianHybridCrossingReduction.prototype.medianRank = function( rankValue, downwardSweep )
Attempts to minimise the median placement of connected cells on this rank and one of the adjacent ranks
| rankValue | the layer number of this rank |
| downwardSweep | whether or not this is a downward sweep through the graph |
mxMedianHybridCrossingReduction.prototype.medianValue = function( connectedCells, rankValue )
Calculates the median rank order positioning for the specified cell using the connected cells on the specified rank. Returns the median rank ordering value of the connected cells
| connectedCells | the cells on the specified rank connected to the specified cell |
| rankValue | the rank that the connected cell lie upon |
A utility class used to track cells whilst sorting occurs on the median values. Does not violate (x.compareTo(y)==0) == (x.equals(y))
| Functions | |
| MedianCellSorter | Constructs a new median cell sorter. |
| Variables | |
| medianValue | The weighted value of the cell stored. |
| cell | The cell whose median value is being calculated |
| Functions | |
| compare | Compares two MedianCellSorters. |
An implementation of the first stage of the Sugiyama layout. Straightforward longest path calculation of layer assignment
| Functions | |
| mxMinimumCycleRemover | Creates a cycle remover for the given internal model. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| Functions | |
| execute | Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use. |
mxMinimumCycleRemover.prototype.layout
Reference to the enclosing mxHierarchicalLayout.
Sets the horizontal locations of node and edge dummy nodes on each layer. Uses median down and up weighings as well as heuristics to straighten edges as far as possible.
| Functions | |
| mxCoordinateAssignment | Creates a coordinate assignment. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| intraCellSpacing | The minimum buffer between cells on the same rank. |
| interRankCellSpacing | The minimum distance between cells on adjacent ranks. |
| parallelEdgeSpacing | The distance between each parallel edge on each ranks for long edges. |
| maxIterations | The number of heuristic iterations to run. |
| prefHozEdgeSep | The preferred horizontal distance between edges exiting a vertex |
| prefVertEdgeOff | The preferred vertical offset between edges exiting a vertex |
| minEdgeJetty | The minimum distance for an edge jetty from a vertex |
| channelBuffer | The size of the vertical buffer in the center of inter-rank channels where edge control points should not be placed |
| jettyPositions | Map of internal edges and (x,y) pair of positions of the start and end jetty for that edge where it connects to the source and target vertices. |
| orientation | The position of the root ( start ) node(s) relative to the rest of the laid out graph. |
| initialX | The minimum x position node placement starts at |
| limitX | The maximum x value this positioning lays up to |
| currentXDelta | The sum of x-displacements for the current iteration |
| widestRank | The rank that has the widest x position |
| rankTopY | Internal cache of top-most values of Y for each rank |
| rankBottomY | Internal cache of bottom-most value of Y for each rank |
| widestRankValue | The X-coordinate of the edge of the widest rank |
| rankWidths | The width of all the ranks |
| rankY | The Y-coordinate of all the ranks |
| fineTuning | Whether or not to perform local optimisations and iterate multiple times through the algorithm. |
| nextLayerConnectedCache | A store of connections to the layer above for speed |
| previousLayerConnectedCache | A store of connections to the layer below for speed |
| groupPadding | Padding added to resized parents |
| Functions | |
| execute | A basic horizontal coordinate assignment algorithm |
| minNode | Performs one median positioning sweep in both directions |
| medianPos | Performs one median positioning sweep in one direction |
| rankMedianPosition | Performs median minimisation over one rank. |
| calculatedWeightedValue | Calculates the priority the specified cell has based on the type of its cell and the cells it is connected to on the next layer |
| medianXValue | Calculates the median position of the connected cell on the specified rank |
| initialCoords | Sets up the layout in an initial positioning. |
| rankCoordinates | Sets up the layout in an initial positioning. |
| calculateWidestRank | Calculates the width rank in the hierarchy. |
| minPath | Straightens out chains of virtual nodes where possibleacade to those stored after this layout processing step has completed. |
| repositionValid | Determines whether or not a node may be moved to the specified x position on the specified rank |
| setCellLocations | Sets the cell locations in the facade to those stored after this layout processing step has completed. |
| localEdgeProcessing | Separates the x position of edges as they connect to vertices |
| setEdgePosition | Fixes the control points |
| setVertexLocation | Fixes the position of the specified vertex. |
| processReversedEdge | Hook to add additional processing |
function mxCoordinateAssignment( layout, intraCellSpacing, interRankCellSpacing, orientation, initialX, parallelEdgeSpacing )
Creates a coordinate assignment.
| intraCellSpacing | the minimum buffer between cells on the same rank |
| interRankCellSpacing | the minimum distance between cells on adjacent ranks |
| orientation | the position of the root node(s) relative to the graph |
| initialX | the leftmost coordinate node placement starts at |
mxCoordinateAssignment.prototype.layout
Reference to the enclosing mxHierarchicalLayout.
mxCoordinateAssignment.prototype.jettyPositions
Map of internal edges and (x,y) pair of positions of the start and end jetty for that edge where it connects to the source and target vertices. Note this should technically be a WeakHashMap, but since JS does not have an equivalent, housekeeping must be performed before using. i.e. check all edges are still in the model and clear the values. Note that the y co-ord is the offset of the jetty, not the absolute point
mxCoordinateAssignment.prototype.orientation
The position of the root ( start ) node(s) relative to the rest of the laid out graph. Default is mxConstants.DIRECTION_NORTH.
mxCoordinateAssignment.prototype.rankMedianPosition = function( rankValue, model, nextRankValue )
Performs median minimisation over one rank.
| rankValue | the layer number of this rank |
| model | an internal model of the hierarchical layout |
| nextRankValue | the layer number whose connected cels are to be laid out relative to |
mxCoordinateAssignment.prototype.calculatedWeightedValue = function( currentCell, collection )
Calculates the priority the specified cell has based on the type of its cell and the cells it is connected to on the next layer
| currentCell | the cell whose weight is to be calculated |
| collection | the cells the specified cell is connected to |
mxCoordinateAssignment.prototype.initialCoords = function( facade, model )
Sets up the layout in an initial positioning. The ranks are all centered as much as possible along the middle vertex in each rank. The other cells are then placed as close as possible on either side.
| facade | the facade describing the input graph |
| model | an internal model of the hierarchical layout |
mxCoordinateAssignment.prototype.rankCoordinates = function( rankValue, graph, model )
Sets up the layout in an initial positioning. All the first cells in each rank are moved to the left and the rest of the rank inserted as close together as their size and buffering permits. This method works on just the specified rank.
| rankValue | the current rank being processed |
| graph | the facade describing the input graph |
| model | an internal model of the hierarchical layout |
mxCoordinateAssignment.prototype.calculateWidestRank = function( graph, model )
Calculates the width rank in the hierarchy. Also set the y value of each rank whilst performing the calculation
| graph | the facade describing the input graph |
| model | an internal model of the hierarchical layout |
mxCoordinateAssignment.prototype.repositionValid = function( model, cell, rank, position )
Determines whether or not a node may be moved to the specified x position on the specified rank
| model | the layout model |
| cell | the cell being analysed |
| rank | the layer of the cell |
| position | the x position being sought |
An implementation of the first stage of the Sugiyama layout. Straightforward longest path calculation of layer assignment
| Functions | |
| mxSwimlaneOrdering | Creates a cycle remover for the given internal model. |
| Variables | |
| layout | Reference to the enclosing mxHierarchicalLayout. |
| Functions | |
| execute | Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use. |
mxSwimlaneOrdering.prototype.layout
Reference to the enclosing mxHierarchicalLayout.
A hierarchical layout algorithm.
| Functions | |
| mxHierarchicalLayout | Constructs a new hierarchical layout algorithm. |
| Variables | |
| roots | Holds the array of mxCell that this layout contains. |
| resizeParent | Specifies if the parent should be resized after the layout so that it contains all the child cells. |
| maintainParentLocation | Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout. |
| moveParent | Specifies if the parent should be moved if resizeParent is enabled. |
| parentBorder | The border to be added around the children if the parent is to be resized using resizeParent. |
| intraCellSpacing | The spacing buffer added between cells on the same layer. |
| interRankCellSpacing | The spacing buffer added between cell on adjacent layers. |
| interHierarchySpacing | The spacing buffer between unconnected hierarchies. |
| parallelEdgeSpacing | The distance between each parallel edge on each ranks for long edges |
| orientation | The position of the root node(s) relative to the laid out graph in. |
| fineTuning | Whether or not to perform local optimisations and iterate multiple times through the algorithm. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| traverseAncestors | Whether or not to drill into child cells and layout in reverse group order. |
| model | The internal mxGraphHierarchyModel formed of the layout. |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgeStyle | The style to apply between cell layers to edge segments |
| Functions | |
| getModel | Returns the internal mxGraphHierarchyModel for this layout algorithm. |
| execute | Executes the layout for the children of the specified parent. |
| findRoots | Returns all visible children in the given parent which do not have incoming edges. |
| getEdges | Returns the connected edges for the given cell. |
| getVisibleTerminal | Helper function to return visible terminal for edge allowing for ports |
| run | The API method used to exercise the layout upon the graph description and produce a separate description of the vertex position and edge routing changes made. |
| filterDescendants | Creates an array of descendant cells |
| isPort | Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal |
| getEdgesBetween | Returns the edges between the given source and target. |
| cycleStage | Executes the cycle stage using mxMinimumCycleRemover. |
| layeringStage | Implements first stage of a Sugiyama layout. |
| crossingStage | Executes the crossing stage using mxMedianHybridCrossingReduction. |
| placementStage | Executes the placement stage using mxCoordinateAssignment. |
function mxHierarchicalLayout( graph, orientation, deterministic )
Constructs a new hierarchical layout algorithm.
| graph | Reference to the enclosing mxGraph. |
| orientation | Optional constant that defines the orientation of this layout. |
| deterministic | Optional boolean that specifies if this layout should be deterministic. Default is true. |
mxHierarchicalLayout.prototype.roots
Holds the array of mxCell that this layout contains.
mxHierarchicalLayout.prototype.resizeParent
Specifies if the parent should be resized after the layout so that it contains all the child cells. Default is false. See also parentBorder.
mxHierarchicalLayout.prototype.moveParent
Specifies if the parent should be moved if resizeParent is enabled. Default is false.
mxHierarchicalLayout.prototype.parentBorder
The border to be added around the children if the parent is to be resized using resizeParent. Default is 0.
mxHierarchicalLayout.prototype.orientation
The position of the root node(s) relative to the laid out graph in. Default is mxConstants.DIRECTION_NORTH.
mxHierarchicalLayout.prototype.model
The internal mxGraphHierarchyModel formed of the layout.
mxHierarchicalLayout.prototype.getModel = function()
Returns the internal mxGraphHierarchyModel for this layout algorithm.
mxHierarchicalLayout.prototype.execute = function( parent, roots )
Executes the layout for the children of the specified parent.
| parent | Parent mxCell that contains the children to be laid out. |
| roots | Optional starting roots of the layout. |
mxHierarchicalLayout.prototype.findRoots = function( parent, vertices )
Returns all visible children in the given parent which do not have incoming edges. If the result is empty then the children with the maximum difference between incoming and outgoing edges are returned. This takes into account edges that are being promoted to the given root due to invisible children or collapsed cells.
| parent | mxCell whose children should be checked. |
| vertices | array of vertices to limit search to |
mxHierarchicalLayout.prototype.getEdges = function( cell )
Returns the connected edges for the given cell.
| cell | mxCell whose edges should be returned. |
mxHierarchicalLayout.prototype.getVisibleTerminal = function( edge, source )
Helper function to return visible terminal for edge allowing for ports
| edge | mxCell whose edges should be returned. |
| source | Boolean that specifies whether the source or target terminal is to be returned |
mxHierarchicalLayout.prototype.isPort = function( cell )
Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal
| cell | mxCell that represents the port. |
A hierarchical layout algorithm.
| Functions | |
| mxSwimlaneLayout | Constructs a new hierarchical layout algorithm. |
| Variables | |
| roots | Holds the array of mxCell that this layout contains. |
| swimlanes | Holds the array of mxCell of the ordered swimlanes to lay out |
| dummyVertices | Holds an array of mxCell of dummy vertices inserted during the layout to pad out empty swimlanes |
| dummyVertexWidth | The cell width of any dummy vertices inserted |
| resizeParent | Specifies if the parent should be resized after the layout so that it contains all the child cells. |
| maintainParentLocation | Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout. |
| moveParent | Specifies if the parent should be moved if resizeParent is enabled. |
| parentBorder | The border to be added around the children if the parent is to be resized using resizeParent. |
| intraCellSpacing | The spacing buffer added between cells on the same layer. |
| interRankCellSpacing | The spacing buffer added between cell on adjacent layers. |
| interHierarchySpacing | The spacing buffer between unconnected hierarchies. |
| parallelEdgeSpacing | The distance between each parallel edge on each ranks for long edges |
| orientation | The position of the root node(s) relative to the laid out graph in. |
| fineTuning | Whether or not to perform local optimisations and iterate multiple times through the algorithm. |
| tightenToSource | Whether or not to tighten the assigned ranks of vertices up towards the source cells. |
| disableEdgeStyle | Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result. |
| traverseAncestors | Whether or not to drill into child cells and layout in reverse group order. |
| model | The internal mxSwimlaneModel formed of the layout. |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgesSet | A cache of edges whose source terminal is the key |
| edgeStyle | The style to apply between cell layers to edge segments |
| Functions | |
| getModel | Returns the internal mxSwimlaneModel for this layout algorithm. |
| execute | Executes the layout for the children of the specified parent. |
| updateGroupBounds | Updates the bounds of the given array of groups so that it includes all child vertices. |
| findRoots | Returns all visible children in the given parent which do not have incoming edges. |
| getEdges | Returns the connected edges for the given cell. |
| getVisibleTerminal | Helper function to return visible terminal for edge allowing for ports |
| run | The API method used to exercise the layout upon the graph description and produce a separate description of the vertex position and edge routing changes made. |
| filterDescendants | Creates an array of descendant cells |
| isPort | Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal |
| getEdgesBetween | Returns the edges between the given source and target. |
| cycleStage | Executes the cycle stage using mxMinimumCycleRemover. |
| layeringStage | Implements first stage of a Sugiyama layout. |
| crossingStage | Executes the crossing stage using mxMedianHybridCrossingReduction. |
| placementStage | Executes the placement stage using mxCoordinateAssignment. |
function mxSwimlaneLayout( graph, orientation, deterministic )
Constructs a new hierarchical layout algorithm.
| graph | Reference to the enclosing mxGraph. |
| orientation | Optional constant that defines the orientation of this layout. |
| deterministic | Optional boolean that specifies if this layout should be deterministic. Default is true. |
mxSwimlaneLayout.prototype.roots
Holds the array of mxCell that this layout contains.
mxSwimlaneLayout.prototype.swimlanes
Holds the array of mxCell of the ordered swimlanes to lay out
mxSwimlaneLayout.prototype.dummyVertices
Holds an array of mxCell of dummy vertices inserted during the layout to pad out empty swimlanes
mxSwimlaneLayout.prototype.resizeParent
Specifies if the parent should be resized after the layout so that it contains all the child cells. Default is false. See also parentBorder.
mxSwimlaneLayout.prototype.moveParent
Specifies if the parent should be moved if resizeParent is enabled. Default is false.
mxSwimlaneLayout.prototype.parentBorder
The border to be added around the children if the parent is to be resized using resizeParent. Default is 0.
mxSwimlaneLayout.prototype.orientation
The position of the root node(s) relative to the laid out graph in. Default is mxConstants.DIRECTION_NORTH.
mxSwimlaneLayout.prototype.model
The internal mxSwimlaneModel formed of the layout.
mxSwimlaneLayout.prototype.getModel = function()
Returns the internal mxSwimlaneModel for this layout algorithm.
mxSwimlaneLayout.prototype.execute = function( parent, swimlanes )
Executes the layout for the children of the specified parent.
| parent | Parent mxCell that contains the children to be laid out. |
| swimlanes | Ordered array of swimlanes to be laid out |
mxSwimlaneLayout.prototype.findRoots = function( parent, vertices )
Returns all visible children in the given parent which do not have incoming edges. If the result is empty then the children with the maximum difference between incoming and outgoing edges are returned. This takes into account edges that are being promoted to the given root due to invisible children or collapsed cells.
| parent | mxCell whose children should be checked. |
| vertices | array of vertices to limit search to |
mxSwimlaneLayout.prototype.getEdges = function( cell )
Returns the connected edges for the given cell.
| cell | mxCell whose edges should be returned. |
mxSwimlaneLayout.prototype.getVisibleTerminal = function( edge, source )
Helper function to return visible terminal for edge allowing for ports
| edge | mxCell whose edges should be returned. |
| source | Boolean that specifies whether the source or target terminal is to be returned |
mxSwimlaneLayout.prototype.isPort = function( cell )
Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal
| cell | mxCell that represents the port. |
Extends mxEventSource to implement a graph model. The graph model acts as a wrapper around the cells which are in charge of storing the actual graph datastructure. The model acts as a transactional wrapper with event notification for all changes, whereas the cells contain the atomic operations for updating the actual datastructure.
The cell hierarchy in the model must have a top-level root cell which contains the layers (typically one default layer), which in turn contain the top-level cells of the layers. This means each cell is contained in a layer. If no layers are required, then all new cells should be added to the default layer.
Layers are useful for hiding and showing groups of cells, or for placing groups of cells on top of other cells in the display. To identify a layer, the isLayer function is used. It returns true if the parent of the given cell is the root of the model.
See events section for more details. There is a new set of events for tracking transactional changes as they happen. The events are called startEdit for the initial beginUpdate, executed for each executed change and endEdit for the terminal endUpdate. The executed event contains a property called change which represents the change after execution.
var enc = new mxCodec(); var node = enc.encode(graph.getModel());
This will create an XML node that contains all the model information.
For the encoding of changes, a graph model listener is required that encodes each change from the given array of changes.
model.addListener(mxEvent.CHANGE, function(sender, evt)
{
var changes = evt.getProperty('edit').changes;
var nodes = [];
var codec = new mxCodec();
for (var i = 0; i < changes.length; i++)
{
nodes.push(codec.encode(changes[i]));
}
// do something with the nodes
});For the decoding and execution of changes, the codec needs a lookup function that allows it to resolve cell IDs as follows:
var codec = new mxCodec();
codec.lookup = function(id)
{
return model.getCell(id);
}For each encoded change (represented by a node), the following code can be used to carry out the decoding and create a change object.
var changes = []; var change = codec.decode(node); change.model = model; change.execute(); changes.push(change);
The changes can then be dispatched using the model as follows.
var edit = new mxUndoableEdit(model, false);
edit.changes = changes;
edit.notify = function()
{
edit.source.fireEvent(new mxEventObject(mxEvent.CHANGE,
'edit', edit, 'changes', edit.changes));
edit.source.fireEvent(new mxEventObject(mxEvent.NOTIFY,
'edit', edit, 'changes', edit.changes));
}
model.fireEvent(new mxEventObject(mxEvent.UNDO, 'edit', edit));
model.fireEvent(new mxEventObject(mxEvent.CHANGE,
'edit', edit, 'changes', changes));| Events | |
| mxEvent. | Fires when an undoable edit is dispatched. |
| mxEvent. | Same as mxEvent.CHANGE, this event can be used for classes that need to implement a sync mechanism between this model and, say, a remote model. |
| mxEvent. | Fires between begin- and endUpdate and after an atomic change was executed in the model. |
| mxEvent. | Fires between START_EDIT and END_EDIT after an atomic change was executed. |
| mxEvent. | Fires after the updateLevel was incremented in beginUpdate. |
| mxEvent. | Fires after the updateLevel was changed from 0 to 1. |
| mxEvent. | Fires after the updateLevel was decreased in endUpdate but before any notification or change dispatching. |
| mxEvent. | Fires after the updateLevel was changed from 1 to 0. |
| mxEvent. | Fires before the change is dispatched after the update level has reached 0 in endUpdate. |
| mxEvent.UNDO | Fires after the change was dispatched in endUpdate. |
| Functions | |
| mxGraphModel | Constructs a new graph model. |
| Variables | |
| root | Holds the root cell, which in turn contains the cells that represent the layers of the diagram as child cells. |
| cells | Maps from Ids to cells. |
| maintainEdgeParent | Specifies if edges should automatically be moved into the nearest common ancestor of their terminals. |
| ignoreRelativeEdgeParent | Specifies if relative edge parents should be ignored for finding the nearest common ancestors of an edge’s terminals. |
| createIds | Specifies if the model should automatically create Ids for new cells. |
| prefix | Defines the prefix of new Ids. |
| postfix | Defines the postfix of new Ids. |
| nextId | Specifies the next Id to be created. |
| currentEdit | Holds the changes for the current transaction. |
| updateLevel | Counter for the depth of nested transactions. |
| endingUpdate | True if the program flow is currently inside endUpdate. |
| Functions | |
| clear | Sets a new root using createRoot. |
| isCreateIds | Returns createIds. |
| setCreateIds | Sets createIds. |
| createRoot | Creates a new root cell with a default layer (child 0). |
| getCell | Returns the mxCell for the specified Id or null if no cell can be found for the given Id. |
| filterCells | Returns the cells from the given array where the given filter function returns true. |
| getDescendants | Returns all descendants of the given cell and the cell itself in an array. |
| filterDescendants | Visits all cells recursively and applies the specified filter function to each cell. |
| getRoot | Returns the root of the model or the topmost parent of the given cell. |
| setRoot | Sets the root of the model using mxRootChange and adds the change to the current transaction. |
| rootChanged | Inner callback to change the root of the model and update the internal datastructures, such as cells and nextId. |
| isRoot | Returns true if the given cell is the root of the model and a non-null value. |
| isLayer | Returns true if isRoot returns true for the parent of the given cell. |
| isAncestor | Returns true if the given parent is an ancestor of the given child. |
| contains | Returns true if the model contains the given mxCell. |
| getParent | Returns the parent of the given cell. |
| add | Adds the specified child to the parent at the given index using mxChildChange and adds the change to the current transaction. |
| cellAdded | Inner callback to update cells when a cell has been added. |
| createId | Hook method to create an Id for the specified cell. |
| updateEdgeParents | Updates the parent for all edges that are connected to cell or one of its descendants using updateEdgeParent. |
| updateEdgeParent | Inner callback to update the parent of the specified mxCell to the nearest-common-ancestor of its two terminals. |
| getOrigin | Returns the absolute, accumulated origin for the children inside the given parent as an mxPoint. |
| getNearestCommonAncestor | Returns the nearest common ancestor for the specified cells. |
| remove | Removes the specified cell from the model using mxChildChange and adds the change to the current transaction. |
| cellRemoved | Inner callback to update cells when a cell has been removed. |
| parentForCellChanged | Inner callback to update the parent of a cell using mxCell.insert on the parent and return the previous parent. |
| getChildCount | Returns the number of children in the given cell. |
| getChildAt | Returns the child of the given mxCell at the given index. |
| getChildren | Returns all children of the given mxCell as an array of mxCells. |
| getChildVertices | Returns the child vertices of the given parent. |
| getChildEdges | Returns the child edges of the given parent. |
| getChildCells | Returns the children of the given cell that are vertices and/or edges depending on the arguments. |
| getTerminal | Returns the source or target mxCell of the given edge depending on the value of the boolean parameter. |
| setTerminal | Sets the source or target terminal of the given mxCell using mxTerminalChange and adds the change to the current transaction. |
| setTerminals | Sets the source and target mxCell of the given mxCell in a single transaction using setTerminal for each end of the edge. |
| terminalForCellChanged | Inner helper function to update the terminal of the edge using mxCell.insertEdge and return the previous terminal. |
| getEdgeCount | Returns the number of distinct edges connected to the given cell. |
| getEdgeAt | Returns the edge of cell at the given index. |
| getDirectedEdgeCount | Returns the number of incoming or outgoing edges, ignoring the given edge. |
| getConnections | Returns all edges of the given cell without loops. |
| getIncomingEdges | Returns the incoming edges of the given cell without loops. |
| getOutgoingEdges | Returns the outgoing edges of the given cell without loops. |
| getEdges | Returns all distinct edges connected to this cell as a new array of mxCells. |
| getEdgesBetween | Returns all edges between the given source and target pair. |
| getOpposites | Returns all opposite vertices wrt terminal for the given edges, only returning sources and/or targets as specified. |
| getTopmostCells | Returns the topmost cells of the hierarchy in an array that contains no descendants for each mxCell that it contains. |
| isVertex | Returns true if the given cell is a vertex. |
| isEdge | Returns true if the given cell is an edge. |
| isConnectable | Returns true if the given mxCell is connectable. |
| getValue | Returns the user object of the given mxCell using mxCell.getValue. |
| setValue | Sets the user object of then given mxCell using mxValueChange and adds the change to the current transaction. |
| valueForCellChanged | Inner callback to update the user object of the given mxCell using mxCell.valueChanged and return the previous value, that is, the return value of mxCell.valueChanged. |
| getGeometry | Returns the mxGeometry of the given mxCell. |
| setGeometry | Sets the mxGeometry of the given mxCell. |
| geometryForCellChanged | Inner callback to update the mxGeometry of the given mxCell using mxCell.setGeometry and return the previous mxGeometry. |
| getStyle | Returns the style of the given mxCell. |
| setStyle | Sets the style of the given mxCell using mxStyleChange and adds the change to the current transaction. |
| styleForCellChanged | Inner callback to update the style of the given mxCell using mxCell.setStyle and return the previous style. |
| isCollapsed | Returns true if the given mxCell is collapsed. |
| setCollapsed | Sets the collapsed state of the given mxCell using mxCollapseChange and adds the change to the current transaction. |
| collapsedStateForCellChanged | Inner callback to update the collapsed state of the given mxCell using mxCell.setCollapsed and return the previous collapsed state. |
| isVisible | Returns true if the given mxCell is visible. |
| setVisible | Sets the visible state of the given mxCell using mxVisibleChange and adds the change to the current transaction. |
| visibleStateForCellChanged | Inner callback to update the visible state of the given mxCell using mxCell.setCollapsed and return the previous visible state. |
| execute | Executes the given edit and fires events if required. |
| beginUpdate | Increments the updateLevel by one. |
| endUpdate | Decrements the updateLevel by one and fires an <undo> event if the updateLevel reaches 0. |
| createUndoableEdit | Creates a new mxUndoableEdit that implements the notify function to fire a <change> and <notify> event through the mxUndoableEdit’s source. |
| mergeChildren | Merges the children of the given cell into the given target cell inside this model. |
| mergeChildren | Clones the children of the source cell into the given target cell in this model and adds an entry to the mapping that maps from the source cell to the target cell with the same id or the clone of the source cell that was inserted into this model. |
| getParents | Returns an array that represents the set (no duplicates) of all parents for the given array of cells. |
| cloneCell | Returns a deep clone of the given mxCell (including the children) which is created using cloneCells. |
| cloneCells | Returns an array of clones for the given array of mxCells. |
| cloneCellImpl | Inner helper method for cloning cells recursively. |
| cellCloned | Hook for cloning the cell. |
| restoreClone | Inner helper method for restoring the connections in a network of cloned cells. |
Fires when an undoable edit is dispatched. The <code>edit</code> property contains the mxUndoableEdit. The <code>changes</code> property contains the array of atomic changes inside the undoable edit. The changes property is <strong>deprecated</strong>, please use edit.changes instead.
graph.model.addListener(mxEvent.CHANGE, function(sender, evt)
{
var changes = evt.getProperty('edit').changes;
for (var i = 0; i < changes.length; i++)
{
var change = changes[i];
if (change instanceof mxChildChange &&
change.change.previous == null)
{
graph.startEditingAtCell(change.child);
break;
}
}
});Same as mxEvent.CHANGE, this event can be used for classes that need to implement a sync mechanism between this model and, say, a remote model. In such a setup, only local changes should trigger a notify event and all changes should trigger a change event.
Fires after the updateLevel was incremented in beginUpdate. This event contains no properties.
Fires after the updateLevel was changed from 0 to 1. This event contains no properties.
Fires after the updateLevel was decreased in endUpdate but before any notification or change dispatching. The <code>edit</code> property contains the currentEdit.
Fires after the updateLevel was changed from 1 to 0. This event contains no properties.
Fires before the change is dispatched after the update level has reached 0 in endUpdate. The <code>edit</code> property contains the <curreneEdit>.
Fires after the change was dispatched in endUpdate. The <code>edit</code> property contains the currentEdit.
mxGraphModel.prototype.currentEdit
Holds the changes for the current transaction. If the transaction is closed then a new object is created for this variable using createUndoableEdit.
mxGraphModel.prototype.updateLevel
Counter for the depth of nested transactions. Each call to beginUpdate will increment this number and each call to endUpdate will decrement it. When the counter reaches 0, the transaction is closed and the respective events are fired. Initial value is 0.
mxGraphModel.prototype.clear = function()
Sets a new root using createRoot.
mxGraphModel.prototype.isCreateIds = function()
Returns createIds.
mxGraphModel.prototype.setCreateIds = function( value )
Sets createIds.
mxGraphModel.prototype.getCell = function( id )
Returns the mxCell for the specified Id or null if no cell can be found for the given Id.
| id | A string representing the Id of the cell. |
mxGraphModel.prototype.getDescendants = function( parent )
Returns all descendants of the given cell and the cell itself in an array.
| parent | mxCell whose descendants should be returned. |
mxGraphModel.prototype.filterDescendants = function( filter, parent )
Visits all cells recursively and applies the specified filter function to each cell. If the function returns true then the cell is added to the resulting array. The parent and result paramters are optional. If parent is not specified then the recursion starts at root.
The following example extracts all vertices from a given model:
var filter = function(cell)
{
return model.isVertex(cell);
}
var vertices = model.filterDescendants(filter);| filter | JavaScript function that takes an mxCell as an argument and returns a boolean. |
| parent | Optional mxCell that is used as the root of the recursion. |
mxGraphModel.prototype.getRoot = function( cell )
Returns the root of the model or the topmost parent of the given cell.
| cell | Optional mxCell that specifies the child. |
mxGraphModel.prototype.setRoot = function( root )
Sets the root of the model using mxRootChange and adds the change to the current transaction. This resets all datastructures in the model and is the preferred way of clearing an existing model. Returns the new root.
var root = new mxCell(); root.insert(new mxCell()); model.setRoot(root);
| root | mxCell that specifies the new root. |
mxGraphModel.prototype.isRoot = function( cell )
Returns true if the given cell is the root of the model and a non-null value.
| cell | mxCell that represents the possible root. |
mxGraphModel.prototype.getParent = function( cell )
Returns the parent of the given cell.
| cell | mxCell whose parent should be returned. |
mxGraphModel.prototype.add = function( parent, child, index )
Adds the specified child to the parent at the given index using mxChildChange and adds the change to the current transaction. If no index is specified then the child is appended to the parent’s array of children. Returns the inserted child.
| parent | mxCell that specifies the parent to contain the child. |
| child | mxCell that specifies the child to be inserted. |
| index | Optional integer that specifies the index of the child. |
mxGraphModel.prototype.cellAdded = function( cell )
Inner callback to update cells when a cell has been added. This implementation resolves collisions by creating new Ids. To change the ID of a cell after it was inserted into the model, use the following code:
(code delete model.cells[cell.getId()]; cell.setId(newId); model.cells[cell.getId()] = cell; (end)
If the change of the ID should be part of the command history, then the cell should be removed from the model and a clone with the new ID should be reinserted into the model instead.
| cell | mxCell that specifies the cell that has been added. |
mxGraphModel.prototype.createId = function( cell )
Hook method to create an Id for the specified cell. This implementation concatenates prefix, id and postfix to create the Id and increments nextId. The cell is ignored by this implementation, but can be used in overridden methods to prefix the Ids with eg. the cell type.
| cell | mxCell to create the Id for. |
mxGraphModel.prototype.updateEdgeParents = function( cell, root )
Updates the parent for all edges that are connected to cell or one of its descendants using updateEdgeParent.
mxGraphModel.prototype.getOrigin = function( cell )
Returns the absolute, accumulated origin for the children inside the given parent as an mxPoint.
mxGraphModel.prototype.remove = function( cell )
Removes the specified cell from the model using mxChildChange and adds the change to the current transaction. This operation will remove the cell and all of its children from the model. Returns the removed cell.
| cell | mxCell that should be removed. |
mxGraphModel.prototype.parentForCellChanged = function( cell, parent, index )
Inner callback to update the parent of a cell using mxCell.insert on the parent and return the previous parent.
| cell | mxCell to update the parent for. |
| parent | mxCell that specifies the new parent of the cell. |
| index | Optional integer that defines the index of the child in the parent’s child array. |
mxGraphModel.prototype.getChildCount = function( cell )
Returns the number of children in the given cell.
| cell | mxCell whose number of children should be returned. |
mxGraphModel.prototype.getChildVertices = function( parent )
Returns the child vertices of the given parent.
| cell | mxCell whose child vertices should be returned. |
mxGraphModel.prototype.getChildEdges = function( parent )
Returns the child edges of the given parent.
| cell | mxCell whose child edges should be returned. |
mxGraphModel.prototype.getChildCells = function( parent, vertices, edges )
Returns the children of the given cell that are vertices and/or edges depending on the arguments.
| cell | mxCell the represents the parent. |
| vertices | Boolean indicating if child vertices should be returned. Default is false. |
| edges | Boolean indicating if child edges should be returned. Default is false. |
mxGraphModel.prototype.setTerminal = function( edge, terminal, isSource )
Sets the source or target terminal of the given mxCell using mxTerminalChange and adds the change to the current transaction. This implementation updates the parent of the edge using updateEdgeParent if required.
| edge | mxCell that specifies the edge. |
| terminal | mxCell that specifies the new terminal. |
| isSource | Boolean indicating if the terminal is the new source or target terminal of the edge. |
mxGraphModel.prototype.setTerminals = function( edge, source, target )
Sets the source and target mxCell of the given mxCell in a single transaction using setTerminal for each end of the edge.
| edge | mxCell that specifies the edge. |
| source | mxCell that specifies the new source terminal. |
| target | mxCell that specifies the new target terminal. |
mxGraphModel.prototype.terminalForCellChanged = function( edge, terminal, isSource )
Inner helper function to update the terminal of the edge using mxCell.insertEdge and return the previous terminal.
| edge | mxCell that specifies the edge to be updated. |
| terminal | mxCell that specifies the new terminal. |
| isSource | Boolean indicating if the terminal is the new source or target terminal of the edge. |
mxGraphModel.prototype.getEdgeCount = function( cell )
Returns the number of distinct edges connected to the given cell.
| cell | mxCell that represents the vertex. |
mxGraphModel.prototype.getEdgeAt = function( cell, index )
Returns the edge of cell at the given index.
| cell | mxCell that specifies the vertex. |
| index | Integer that specifies the index of the edge to return. |
mxGraphModel.prototype.getDirectedEdgeCount = function( cell, outgoing, ignoredEdge )
Returns the number of incoming or outgoing edges, ignoring the given edge.
| cell | mxCell whose edge count should be returned. |
| outgoing | Boolean that specifies if the number of outgoing or incoming edges should be returned. |
| ignoredEdge | mxCell that represents an edge to be ignored. |
mxGraphModel.prototype.getConnections = function( cell )
Returns all edges of the given cell without loops.
| cell | mxCell whose edges should be returned. |
mxGraphModel.prototype.getIncomingEdges = function( cell )
Returns the incoming edges of the given cell without loops.
| cell | mxCell whose incoming edges should be returned. |
mxGraphModel.prototype.getOutgoingEdges = function( cell )
Returns the outgoing edges of the given cell without loops.
| cell | mxCell whose outgoing edges should be returned. |
mxGraphModel.prototype.getEdges = function( cell, incoming, outgoing, includeLoops )
Returns all distinct edges connected to this cell as a new array of mxCells. If at least one of incoming or outgoing is true, then loops are ignored, otherwise if both are false, then all edges connected to the given cell are returned including loops.
| cell | mxCell that specifies the cell. |
| incoming | Optional boolean that specifies if incoming edges should be returned. Default is true. |
| outgoing | Optional boolean that specifies if outgoing edges should be returned. Default is true. |
| includeLoops | Optional boolean that specifies if loops should be returned. Default is true. |
mxGraphModel.prototype.getEdgesBetween = function( source, target, directed )
Returns all edges between the given source and target pair. If directed is true, then only edges from the source to the target are returned, otherwise, all edges between the two cells are returned.
| source | mxCell that defines the source terminal of the edge to be returned. |
| target | mxCell that defines the target terminal of the edge to be returned. |
| directed | Optional boolean that specifies if the direction of the edge should be taken into account. Default is false. |
mxGraphModel.prototype.getOpposites = function( edges, terminal, sources, targets )
Returns all opposite vertices wrt terminal for the given edges, only returning sources and/or targets as specified. The result is returned as an array of mxCells.
| edges | Array of mxCells that contain the edges to be examined. |
| terminal | mxCell that specifies the known end of the edges. |
| sources | Boolean that specifies if source terminals should be contained in the result. Default is true. |
| targets | Boolean that specifies if target terminals should be contained in the result. Default is true. |
mxGraphModel.prototype.getTopmostCells = function( cells )
Returns the topmost cells of the hierarchy in an array that contains no descendants for each mxCell that it contains. Duplicates should be removed in the cells array to improve performance.
| cells | Array of mxCells whose topmost ancestors should be returned. |
mxGraphModel.prototype.isVertex = function( cell )
Returns true if the given cell is a vertex.
| cell | mxCell that represents the possible vertex. |
mxGraphModel.prototype.isEdge = function( cell )
Returns true if the given cell is an edge.
| cell | mxCell that represents the possible edge. |
mxGraphModel.prototype.isConnectable = function( cell )
Returns true if the given mxCell is connectable. If <edgesConnectable> is false, then this function returns false for all edges else it returns the return value of mxCell.isConnectable.
| cell | mxCell whose connectable state should be returned. |
mxGraphModel.prototype.getValue = function( cell )
Returns the user object of the given mxCell using mxCell.getValue.
| cell | mxCell whose user object should be returned. |
mxGraphModel.prototype.setValue = function( cell, value )
Sets the user object of then given mxCell using mxValueChange and adds the change to the current transaction.
| cell | mxCell whose user object should be changed. |
| value | Object that defines the new user object. |
mxGraphModel.prototype.valueForCellChanged = function( cell, value )
Inner callback to update the user object of the given mxCell using mxCell.valueChanged and return the previous value, that is, the return value of mxCell.valueChanged.
To change a specific attribute in an XML node, the following code can be used.
graph.getModel().valueForCellChanged = function(cell, value)
{
var previous = cell.value.getAttribute('label');
cell.value.setAttribute('label', value);
return previous;
};
mxGraphModel.prototype.getGeometry = function( cell )
Returns the mxGeometry of the given mxCell.
| cell | mxCell whose geometry should be returned. |
mxGraphModel.prototype.setGeometry = function( cell, geometry )
Sets the mxGeometry of the given mxCell. The actual update of the cell is carried out in geometryForCellChanged. The mxGeometryChange action is used to encapsulate the change.
| cell | mxCell whose geometry should be changed. |
| geometry | mxGeometry that defines the new geometry. |
mxGraphModel.prototype.geometryForCellChanged = function( cell, geometry )
Inner callback to update the mxGeometry of the given mxCell using mxCell.setGeometry and return the previous mxGeometry.
mxGraphModel.prototype.setStyle = function( cell, style )
Sets the style of the given mxCell using mxStyleChange and adds the change to the current transaction.
| cell | mxCell whose style should be changed. |
| style | String of the form [stylename;|key=value;] to specify the new cell style. |
mxGraphModel.prototype.styleForCellChanged = function( cell, style )
Inner callback to update the style of the given mxCell using mxCell.setStyle and return the previous style.
| cell | mxCell that specifies the cell to be updated. |
| style | String of the form [stylename;|key=value;] to specify the new cell style. |
mxGraphModel.prototype.setCollapsed = function( cell, collapsed )
Sets the collapsed state of the given mxCell using mxCollapseChange and adds the change to the current transaction.
| cell | mxCell whose collapsed state should be changed. |
| collapsed | Boolean that specifies the new collpased state. |
mxGraphModel.prototype.collapsedStateForCellChanged = function( cell, collapsed )
Inner callback to update the collapsed state of the given mxCell using mxCell.setCollapsed and return the previous collapsed state.
| cell | mxCell that specifies the cell to be updated. |
| collapsed | Boolean that specifies the new collpased state. |
mxGraphModel.prototype.setVisible = function( cell, visible )
Sets the visible state of the given mxCell using mxVisibleChange and adds the change to the current transaction.
| cell | mxCell whose visible state should be changed. |
| visible | Boolean that specifies the new visible state. |
mxGraphModel.prototype.visibleStateForCellChanged = function( cell, visible )
Inner callback to update the visible state of the given mxCell using mxCell.setCollapsed and return the previous visible state.
| cell | mxCell that specifies the cell to be updated. |
| visible | Boolean that specifies the new visible state. |
mxGraphModel.prototype.execute = function( change )
Executes the given edit and fires events if required. The edit object requires an execute function which is invoked. The edit is added to the currentEdit between beginUpdate and endUpdate calls, so that events will be fired if this execute is an individual transaction, that is, if no previous beginUpdate calls have been made without calling endUpdate. This implementation fires an execute event before executing the given change.
| change | Object that described the change. |
mxGraphModel.prototype.beginUpdate = function()
Increments the updateLevel by one. The event notification is queued until updateLevel reaches 0 by use of endUpdate.
All changes on mxGraphModel are transactional, that is, they are executed in a single undoable change on the model (without transaction isolation). Therefore, if you want to combine any number of changes into a single undoable change, you should group any two or more API calls that modify the graph model between beginUpdate and endUpdate calls as shown here:
var model = graph.getModel();
var parent = graph.getDefaultParent();
var index = model.getChildCount(parent);
model.beginUpdate();
try
{
model.add(parent, v1, index);
model.add(parent, v2, index+1);
}
finally
{
model.endUpdate();
}Of course there is a shortcut for appending a sequence of cells into the default parent:
graph.addCells([v1, v2]).
mxGraphModel.prototype.endUpdate = function()
Decrements the updateLevel by one and fires an <undo> event if the updateLevel reaches 0. This function indirectly fires a <change> event by invoking the notify function on the currentEdit und then creates a new currentEdit using createUndoableEdit.
The <undo> event is fired only once per edit, whereas the <change> event is fired whenever the notify function is invoked, that is, on undo and redo of the edit.
mxGraphModel.prototype.createUndoableEdit = function( significant )
Creates a new mxUndoableEdit that implements the notify function to fire a <change> and <notify> event through the mxUndoableEdit’s source.
| significant | Optional boolean that specifies if the edit to be created is significant. Default is true. |
mxGraphModel.prototype.mergeChildren = function( from, to, cloneAllEdges )
Merges the children of the given cell into the given target cell inside this model. All cells are cloned unless there is a corresponding cell in the model with the same id, in which case the source cell is ignored and all edges are connected to the corresponding cell in this model. Edges are considered to have no identity and are always cloned unless the cloneAllEdges flag is set to false, in which case edges with the same id in the target model are reconnected to reflect the terminals of the source edges.
mxGraphModel.prototype.mergeChildrenImpl = function( from, to, cloneAllEdges, mapping )
Clones the children of the source cell into the given target cell in this model and adds an entry to the mapping that maps from the source cell to the target cell with the same id or the clone of the source cell that was inserted into this model.
mxGraphModel.prototype.cloneCell = function( cell )
Returns a deep clone of the given mxCell (including the children) which is created using cloneCells.
| cell | mxCell to be cloned. |
mxGraphModel.prototype.cloneCells = function( cells, includeChildren, mapping )
Returns an array of clones for the given array of mxCells. Depending on the value of includeChildren, a deep clone is created for each cell. Connections are restored based if the corresponding cell is contained in the passed in array.
| cells | Array of mxCell to be cloned. |
| includeChildren | Boolean indicating if the cells should be cloned with all descendants. |
| mapping | Optional mapping for existing clones. |
Action to change the root in a model.
| Functions | |
| mxRootChange | Constructs a change of the root in the specified model. |
| execute | Carries out a change of the root using mxGraphModel.rootChanged. |
mxRootChange.prototype.execute = function()
Carries out a change of the root using mxGraphModel.rootChanged.
Action to add or remove a child in a model.
| Functions | |
| mxChildChange | Constructs a change of a child in the specified model. |
| execute | Changes the parent of <child> using mxGraphModel.parentForCellChanged and removes or restores the cell’s connections. |
| disconnect | Disconnects the given cell recursively from its terminals and stores the previous terminal in the cell’s terminals. |
mxChildChange.prototype.execute = function()
Changes the parent of <child> using mxGraphModel.parentForCellChanged and removes or restores the cell’s connections.
Action to change a terminal in a model.
| Functions | |
| mxTerminalChange | Constructs a change of a terminal in the specified model. |
| execute | Changes the terminal of <cell> to <previous> using mxGraphModel.terminalForCellChanged. |
mxTerminalChange.prototype.execute = function()
Changes the terminal of <cell> to <previous> using mxGraphModel.terminalForCellChanged.
Action to change a user object in a model.
| Functions | |
| mxValueChange | Constructs a change of a user object in the specified model. |
| execute | Changes the value of <cell> to <previous> using mxGraphModel.valueForCellChanged. |
mxValueChange.prototype.execute = function()
Changes the value of <cell> to <previous> using mxGraphModel.valueForCellChanged.
Action to change a cell’s style in a model.
| Functions | |
| mxStyleChange | Constructs a change of a style in the specified model. |
| execute | Changes the style of <cell> to <previous> using mxGraphModel.styleForCellChanged. |
mxStyleChange.prototype.execute = function()
Changes the style of <cell> to <previous> using mxGraphModel.styleForCellChanged.
Action to change a cell’s geometry in a model.
| Functions | |
| mxGeometryChange | Constructs a change of a geometry in the specified model. |
| execute | Changes the geometry of <cell> ro <previous> using mxGraphModel.geometryForCellChanged. |
mxGeometryChange.prototype.execute = function()
Changes the geometry of <cell> ro <previous> using mxGraphModel.geometryForCellChanged.
Action to change a cell’s collapsed state in a model.
| Functions | |
| mxCollapseChange | Constructs a change of a collapsed state in the specified model. |
| execute | Changes the collapsed state of <cell> to <previous> using mxGraphModel.collapsedStateForCellChanged. |
mxCollapseChange.prototype.execute = function()
Changes the collapsed state of <cell> to <previous> using mxGraphModel.collapsedStateForCellChanged.
Action to change a cell’s visible state in a model.
| Functions | |
| mxVisibleChange | Constructs a change of a visible state in the specified model. |
| execute | Changes the visible state of <cell> to <previous> using mxGraphModel.visibleStateForCellChanged. |
mxVisibleChange.prototype.execute = function()
Changes the visible state of <cell> to <previous> using mxGraphModel.visibleStateForCellChanged.
Action to change the attribute of a cell’s user object. There is no method on the graph model that uses this action. To use the action, you can use the code shown in the example below.
To change the attributeName in the cell’s user object to attributeValue, use the following code:
model.beginUpdate();
try
{
var edit = new mxCellAttributeChange(
cell, attributeName, attributeValue);
model.execute(edit);
}
finally
{
model.endUpdate();
}| Functions | |
| mxCellAttributeChange | Constructs a change of a attribute of the DOM node stored as the value of the given mxCell. |
| execute | Changes the attribute of the cell’s user object by using mxCell.setAttribute. |
function mxCellAttributeChange( cell, attribute, value )
Constructs a change of a attribute of the DOM node stored as the value of the given mxCell.
mxCellAttributeChange.prototype.execute = function()
Changes the attribute of the cell’s user object by using mxCell.setAttribute.
Cells are the elements of the graph model. They represent the state of the groups, vertices and edges in a graph.
For custom attributes we recommend using an XML node as the value of a cell. The following code can be used to create a cell with an XML node as the value:
var doc = mxUtils.createXmlDocument();
var node = doc.createElement('MyNode')
node.setAttribute('label', 'MyLabel');
node.setAttribute('attribute1', 'value1');
graph.insertVertex(graph.getDefaultParent(), null, node, 40, 40, 80, 30);For the label to work, mxGraph.convertValueToString and mxGraph.cellLabelChanged should be overridden as follows:
graph.convertValueToString = function(cell)
{
if (mxUtils.isNode(cell.value))
{
return cell.getAttribute('label', '')
}
};
var cellLabelChanged = graph.cellLabelChanged;
graph.cellLabelChanged = function(cell, newValue, autoSize)
{
if (mxUtils.isNode(cell.value))
{
// Clones the value for correct undo/redo
var elt = cell.value.cloneNode(true);
elt.setAttribute('label', newValue);
newValue = elt;
}
cellLabelChanged.apply(this, arguments);
};| Functions | |
| onInit | Called from within the constructor. |
| mxCell | Constructs a new cell to be used in a graph model. |
| Variables | |
| id | Holds the Id. |
| value | Holds the user object. |
| geometry | Holds the mxGeometry. |
| style | Holds the style as a string of the form [(stylename|key=value);]. |
| vertex | Specifies whether the cell is a vertex. |
| edge | Specifies whether the cell is an edge. |
| connectable | Specifies whether the cell is connectable. |
| visible | Specifies whether the cell is visible. |
| collapsed | Specifies whether the cell is collapsed. |
| parent | Reference to the parent cell. |
| source | Reference to the source terminal. |
| target | Reference to the target terminal. |
| children | Holds the child cells. |
| edges | Holds the edges. |
| mxTransient | List of members that should not be cloned inside clone. |
| Functions | |
| getId | Returns the Id of the cell as a string. |
| setId | Sets the Id of the cell to the given string. |
| getValue | Returns the user object of the cell. |
| setValue | Sets the user object of the cell. |
| valueChanged | Changes the user object after an in-place edit and returns the previous value. |
| getGeometry | Returns the mxGeometry that describes the geometry. |
| setGeometry | Sets the mxGeometry to be used as the geometry. |
| getStyle | Returns a string that describes the style. |
| setStyle | Sets the string to be used as the style. |
| isVertex | Returns true if the cell is a vertex. |
| setVertex | Specifies if the cell is a vertex. |
| isEdge | Returns true if the cell is an edge. |
| setEdge | Specifies if the cell is an edge. |
| isConnectable | Returns true if the cell is connectable. |
| setConnectable | Sets the connectable state. |
| isVisible | Returns true if the cell is visibile. |
| setVisible | Specifies if the cell is visible. |
| isCollapsed | Returns true if the cell is collapsed. |
| setCollapsed | Sets the collapsed state. |
| getParent | Returns the cell’s parent. |
| setParent | Sets the parent cell. |
| getTerminal | Returns the source or target terminal. |
| setTerminal | Sets the source or target terminal and returns the new terminal. |
| getChildCount | Returns the number of child cells. |
| getIndex | Returns the index of the specified child in the child array. |
| getChildAt | Returns the child at the specified index. |
| insert | Inserts the specified child into the child array at the specified index and updates the parent reference of the child. |
| remove | Removes the child at the specified index from the child array and returns the child that was removed. |
| removeFromParent | Removes the cell from its parent. |
| getEdgeCount | Returns the number of edges in the edge array. |
| getEdgeIndex | Returns the index of the specified edge in edges. |
| getEdgeAt | Returns the edge at the specified index in edges. |
| insertEdge | Inserts the specified edge into the edge array and returns the edge. |
| removeEdge | Removes the specified edge from the edge array and returns the edge. |
| removeFromTerminal | Removes the edge from its source or target terminal. |
| hasAttribute | Returns true if the user object is an XML node that contains the given attribute. |
| getAttribute | Returns the specified attribute from the user object if it is an XML node. |
| setAttribute | Sets the specified attribute on the user object if it is an XML node. |
| clone | Returns a clone of the cell. |
| cloneValue | Returns a clone of the cell’s user object. |
function mxCell( value, geometry, style )
Constructs a new cell to be used in a graph model. This method invokes onInit upon completion.
| value | Optional object that represents the cell value. |
| geometry | Optional mxGeometry that specifies the geometry. |
| style | Optional formatted string that defines the style. |
mxCell.prototype.geometry
Holds the mxGeometry. Default is null.
mxCell.prototype.mxTransient
List of members that should not be cloned inside clone. This field is passed to mxUtils.clone and is not made persistent in mxCellCodec. This is not a convention for all classes, it is only used in this class to mark transient fields since transient modifiers are not supported by the language.
mxCell.prototype.getValue = function()
Returns the user object of the cell. The user object is stored in value.
mxCell.prototype.setValue = function( value )
Sets the user object of the cell. The user object is stored in value.
mxCell.prototype.getGeometry = function()
Returns the mxGeometry that describes the geometry.
mxCell.prototype.setGeometry = function( geometry )
Sets the mxGeometry to be used as the geometry.
mxCell.prototype.getStyle = function()
Returns a string that describes the style.
mxCell.prototype.setStyle = function( style )
Sets the string to be used as the style.
mxCell.prototype.setParent = function( parent )
Sets the parent cell.
| parent | mxCell that represents the new parent. |
mxCell.prototype.setTerminal = function( terminal, isSource )
Sets the source or target terminal and returns the new terminal.
| terminal | mxCell that represents the new source or target terminal. |
| isSource | Boolean that specifies if the source or target terminal should be set. |
mxCell.prototype.insert = function( child, index )
Inserts the specified child into the child array at the specified index and updates the parent reference of the child. If not childIndex is specified then the child is appended to the child array. Returns the inserted child.
| child | mxCell to be inserted or appended to the child array. |
| index | Optional integer that specifies the index at which the child should be inserted into the child array. |
mxCell.prototype.getEdgeAt = function( index )
Returns the edge at the specified index in edges.
| index | Integer that specifies the index of the edge to be returned. |
mxCell.prototype.insertEdge = function( edge, isOutgoing )
Inserts the specified edge into the edge array and returns the edge. Will update the respective terminal reference of the edge.
| edge | mxCell to be inserted into the edge array. |
| isOutgoing | Boolean that specifies if the edge is outgoing. |
mxCell.prototype.removeEdge = function( edge, isOutgoing )
Removes the specified edge from the edge array and returns the edge. Will remove the respective terminal reference from the edge.
| edge | mxCell to be removed from the edge array. |
| isOutgoing | Boolean that specifies if the edge is outgoing. |
mxCell.prototype.clone = function()
Returns a clone of the cell. Uses cloneValue to clone the user object. All fields in mxTransient are ignored during the cloning.
Extends mxRectangle to represent the geometry of a cell.
For vertices, the geometry consists of the x- and y-location, and the width and height. For edges, the geometry consists of the optional terminal- and control points. The terminal points are only required if an edge is unconnected, and are stored in the sourcePoint> and targetPoint variables, respectively.
If an edge is unconnected, that is, it has no source or target terminal, then a geometry with terminal points for a new edge can be defined as follows.
geometry.setTerminalPoint(new mxPoint(x1, y1), true); geometry.points = [new mxPoint(x2, y2)]; geometry.setTerminalPoint(new mxPoint(x3, y3), false);
Control points are used regardless of the connected state of an edge and may be ignored or interpreted differently depending on the edge’s mxEdgeStyle.
To disable automatic reset of control points after a cell has been moved or resized, the the <mxGraph.resizeEdgesOnMove> and mxGraph.resetEdgesOnResize may be used.
Using the x- and y-coordinates of a cell’s geometry, it is possible to position the label on edges on a specific location on the actual edge shape as it appears on the screen. The x-coordinate of an edge’s geometry is used to describe the distance from the center of the edge from -1 to 1 with 0 being the center of the edge and the default value. The y-coordinate of an edge’s geometry is used to describe the absolute, orthogonal distance in pixels from that point. In addition, the mxGeometry.offset is used as an absolute offset vector from the resulting point.
This coordinate system is applied if relative is true, otherwise the offset defines the absolute vector from the edge’s center point to the label and the values for <x> and <y> are ignored.
The width and height parameter for edge geometries can be used to set the label width and height (eg. for word wrapping).
The term “port” refers to a relatively positioned, connectable child cell, which is used to specify the connection between the parent and another cell in the graph. Ports are typically modeled as vertices with relative geometries.
The offset field is interpreted in 3 different ways, depending on the cell and the geometry. For edges, the offset defines the absolute offset for the edge label. For relative geometries, the offset defines the absolute offset for the origin (top, left corner) of the vertex, otherwise the offset defines the absolute offset for the label inside the vertex or group.
| Functions | |
| mxGeometry | Constructs a new object to describe the size and location of a vertex or the control points of an edge. |
| Variables | |
| TRANSLATE_CONTROL_POINTS | Global switch to translate the points in translate. |
| alternateBounds | Stores alternate values for x, y, width and height in a rectangle. |
| sourcePoint | Defines the source mxPoint of the edge. |
| targetPoint | Defines the target mxPoint of the edge. |
| points | Array of mxPoints which specifies the control points along the edge. |
| offset | For edges, this holds the offset (in pixels) from the position defined by <x> and <y> on the edge. |
| relative | Specifies if the coordinates in the geometry are to be interpreted as relative coordinates. |
| Functions | |
| swap | Swaps the x, y, width and height with the values stored in alternateBounds and puts the previous values into alternateBounds as a rectangle. |
| getTerminalPoint | Returns the mxPoint representing the source or target point of this edge. |
| setTerminalPoint | Sets the sourcePoint or targetPoint to the given mxPoint and returns the new point. |
| rotate | Rotates the geometry by the given angle around the given center. |
| translate | Translates the geometry by the specified amount. |
| scale | Scales the geometry by the given amount. |
| equals | Returns true if the given object equals this geometry. |
mxGeometry.prototype.alternateBounds
Stores alternate values for x, y, width and height in a rectangle. See swap to exchange the values. Default is null.
mxGeometry.prototype.sourcePoint
Defines the source mxPoint of the edge. This is used if the corresponding edge does not have a source vertex. Otherwise it is ignored. Default is null.
mxGeometry.prototype.targetPoint
Defines the target mxPoint of the edge. This is used if the corresponding edge does not have a target vertex. Otherwise it is ignored. Default is null.
mxGeometry.prototype.points
Array of mxPoints which specifies the control points along the edge. These points are the intermediate points on the edge, for the endpoints use targetPoint and sourcePoint or set the terminals of the edge to a non-null value. Default is null.
mxGeometry.prototype.offset
For edges, this holds the offset (in pixels) from the position defined by <x> and <y> on the edge. For relative geometries (for vertices), this defines the absolute offset from the point defined by the relative coordinates. For absolute geometries (for vertices), this defines the offset for the label. Default is null.
mxGeometry.prototype.relative
Specifies if the coordinates in the geometry are to be interpreted as relative coordinates. For edges, this is used to define the location of the edge label relative to the edge as rendered on the display. For vertices, this specifies the relative location inside the bounds of the parent cell.
If this is false, then the coordinates are relative to the origin of the parent cell or, for edges, the edge label position is relative to the center of the edge as rendered on screen.
Default is false.
mxGeometry.prototype.swap = function()
Swaps the x, y, width and height with the values stored in alternateBounds and puts the previous values into alternateBounds as a rectangle. This operation is carried-out in-place, that is, using the existing geometry instance. If this operation is called during a graph model transactional change, then the geometry should be cloned before calling this method and setting the geometry of the cell using mxGraphModel.setGeometry.
mxGeometry.prototype.getTerminalPoint = function( isSource )
Returns the mxPoint representing the source or target point of this edge. This is only used if the edge has no source or target vertex.
| isSource | Boolean that specifies if the source or target point should be returned. |
mxGeometry.prototype.setTerminalPoint = function( point, isSource )
Sets the sourcePoint or targetPoint to the given mxPoint and returns the new point.
| point | Point to be used as the new source or target point. |
| isSource | Boolean that specifies if the source or target point should be set. |
mxGeometry.prototype.rotate = function( angle, cx )
Rotates the geometry by the given angle around the given center. That is, <x> and <y> of the geometry, the sourcePoint, targetPoint and all points are translated by the given amount. <x> and <y> are only translated if relative is false.
| angle | Number that specifies the rotation angle in degrees. |
| cx | mxPoint that specifies the center of the rotation. |
mxGeometry.prototype.translate = function( dx, dy )
Translates the geometry by the specified amount. That is, <x> and <y> of the geometry, the sourcePoint, targetPoint and all points are translated by the given amount. <x> and <y> are only translated if relative is false. If TRANSLATE_CONTROL_POINTS is false, then points are not modified by this function.
| dx | Number that specifies the x-coordinate of the translation. |
| dy | Number that specifies the y-coordinate of the translation. |
mxGeometry.prototype.scale = function( sx, sy, fixedAspect )
Scales the geometry by the given amount. That is, <x> and <y> of the geometry, the sourcePoint, targetPoint and all points are scaled by the given amount. <x>, <y>, <width> and <height> are only scaled if relative is false. If <fixedAspect> is true, then the smaller value is used to scale the width and the height.
| sx | Number that specifies the horizontal scale factor. |
| sy | Number that specifies the vertical scale factor. |
| fixedAspect | Optional boolean to keep the aspect ratio fixed. |
Implements a mechanism for temporary cell Ids.
| Variables | |
| PATH_SEPARATOR | Defines the separator between the path components. |
| Functions | |
| create | Creates the cell path for the given cell. |
| getParentPath | Returns the path for the parent of the cell represented by the given path. |
| resolve | Returns the cell for the specified cell path using the given root as the root of the path. |
| compare | Compares the given cell paths and returns -1 if p1 is smaller, 0 if p1 is equal and 1 if p1 is greater than p2. |
Provides various perimeter functions to be used in a style as the value of mxConstants.STYLE_PERIMETER. Perimeters for rectangle, circle, rhombus and triangle are available.
<add as="perimeter">mxPerimeter.RectanglePerimeter</add>
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
When adding new perimeter functions, it is recommended to use the mxPerimeter-namespace as follows:
mxPerimeter.CustomPerimeter = function (bounds, vertex, next, orthogonal)
{
var x = 0; // Calculate x-coordinate
var y = 0; // Calculate y-coordainte
return new mxPoint(x, y);
}mxStyleRegistry.putValue('customPerimeter', mxPerimeter.CustomPerimeter);model.setStyle(vertex, 'perimeter=customPerimeter');
Note that the key of the mxStyleRegistry entry for the function should be used in string values, unless mxGraphView.allowEval is true, in which case you can also use mxPerimeter.CustomPerimeter for the value in the cell style above.
var style = graph.getStylesheet().getDefaultVertexStyle(); style[mxConstants.STYLE_PERIMETER] = mxPerimeter.CustomPerimeter;
Note that the object can be used directly when programmatically setting the value, but the key in the mxStyleRegistry should be used when setting the value via a key, value pair in a cell style.
The parameters are explained in RectanglePerimeter.
| Functions | |
| RectanglePerimeter | Describes a rectangular perimeter for the given bounds. |
| EllipsePerimeter | Describes an elliptic perimeter. |
| RhombusPerimeter | Describes a rhombus (aka diamond) perimeter. |
| TrianglePerimeter | Describes a triangle perimeter. |
| HexagonPerimeter | Describes a hexagon perimeter. |
RectanglePerimeter: function ( bounds, vertex, next, orthogonal )
Describes a rectangular perimeter for the given bounds.
| bounds | mxRectangle that represents the absolute bounds of the vertex. |
| vertex | mxCellState that represents the vertex. |
| next | mxPoint that represents the nearest neighbour point on the given edge. |
| orthogonal | Boolean that specifies if the orthogonal projection onto the perimeter should be returned. If this is false then the intersection of the perimeter and the line between the next and the center point is returned. |
EllipsePerimeter: function ( bounds, vertex, next, orthogonal )
Describes an elliptic perimeter. See RectanglePerimeter for a description of the parameters.
RhombusPerimeter: function ( bounds, vertex, next, orthogonal )
Describes a rhombus (aka diamond) perimeter. See RectanglePerimeter for a description of the parameters.
TrianglePerimeter: function ( bounds, vertex, next, orthogonal )
Describes a triangle perimeter. See RectanglePerimeter for a description of the parameters.
HexagonPerimeter: function ( bounds, vertex, next, orthogonal )
Describes a hexagon perimeter. See RectanglePerimeter for a description of the parameters.
Implements printing of a diagram across multiple pages. The following opens a print preview for an existing graph:
var preview = new mxPrintPreview(graph); preview.open();
Use mxUtils.getScaleForPageCount as follows in order to print the graph across a given number of pages:
var pageCount = mxUtils.prompt('Enter page count', '1');
if (pageCount != null)
{
var scale = mxUtils.getScaleForPageCount(pageCount, graph);
var preview = new mxPrintPreview(graph, scale);
preview.open();
}To add additional pages before and after the output, getCoverPages and getAppendices can be used, respectively.
var preview = new mxPrintPreview(graph, 1);
preview.getCoverPages = function(w, h)
{
return [this.renderPage(w, h, 0, 0, mxUtils.bind(this, function(div)
{
div.innerHTML = '<div style="position:relative;margin:4px;">Cover Page</p>'
}))];
};
preview.getAppendices = function(w, h)
{
return [this.renderPage(w, h, 0, 0, mxUtils.bind(this, function(div)
{
div.innerHTML = '<div style="position:relative;margin:4px;">Appendix</p>'
}))];
};
preview.open();The CSS from the original page is not carried over to the print preview. To add CSS to the page, use the css argument in the open function or override writeHead to add the respective link tags as follows:
var writeHead = preview.writeHead;
preview.writeHead = function(doc, css)
{
writeHead.apply(this, arguments);
doc.writeln('<link rel="stylesheet" type="text/css" href="style.css">');
};To add a padding to the page in the preview (but not the print output), use the following code:
preview.writeHead = function(doc)
{
writeHead.apply(this, arguments);
doc.writeln('<style type="text/css">');
doc.writeln('@media screen {');
doc.writeln(' body > div { padding-top:30px;padding-left:40px;box-sizing:content-box; }');
doc.writeln('}');
doc.writeln('</style>');
};Apart from setting the title argument in the mxPrintPreview constructor you can override renderPage as follows to add a header to any page:
var oldRenderPage = mxPrintPreview.prototype.renderPage;
mxPrintPreview.prototype.renderPage = function(w, h, x, y, content, pageNumber)
{
var div = oldRenderPage.apply(this, arguments);
var header = document.createElement('div');
header.style.position = 'absolute';
header.style.top = '0px';
header.style.width = '100%';
header.style.textAlign = 'right';
mxUtils.write(header, 'Your header here');
div.firstChild.appendChild(header);
return div;
};The pageNumber argument contains the number of the current page, starting at 1. To display a header on the first page only, check pageNumber and add a vertical offset in the constructor call for the height of the header.
For landscape printing, use <mxConstants.PAGE_FORMAT_A4_LANDSCAPE> as the pageFormat in mxUtils.getScaleForPageCount and mxPrintPreview. Keep in mind that one can not set the defaults for the print dialog of the operating system from JavaScript so the user must manually choose a page format that matches this setting.
You can try passing the following CSS directive to open to set the page format in the print dialog to landscape. However, this CSS directive seems to be ignored in most major browsers, including IE.
@page {
size: landscape;
}Note that the print preview behaves differently in IE when used from the filesystem or via HTTP so printing should always be tested via HTTP.
If you are using a DOCTYPE in the source page you can override <getDoctype> and provide the same DOCTYPE for the print preview if required. Here is an example for IE8 standards mode.
var preview = new mxPrintPreview(graph);
preview.getDoctype = function()
{
return '<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=5,IE=8" ><![endif]-->';
};
preview.open();| Functions | |
| mxPrintPreview | Constructs a new print preview for the given parameters. |
| Variables | |
| graph | Reference to the mxGraph that should be previewed. |
| pageFormat | Holds the mxRectangle that defines the page format. |
| scale | Holds the scale of the print preview. |
| border | The border inset around each side of every page in the preview. |
| marginTop | The margin at the top of the page (number). |
| marginBottom | The margin at the bottom of the page (number). |
| x0 | Holds the horizontal offset of the output. |
| y0 | Holds the vertical offset of the output. |
| autoOrigin | Specifies if the origin should be automatically computed based on the top, left corner of the actual diagram contents. |
| printOverlays | Specifies if overlays should be printed. |
| printControls | Specifies if controls (such as folding icons) should be printed. |
| printBackgroundImage | Specifies if the background image should be printed. |
| backgroundColor | Holds the color value for the page background color. |
| borderColor | Holds the color value for the page border. |
| title | Holds the title of the preview window. |
| pageSelector | Boolean that specifies if the page selector should be displayed. |
| wnd | Reference to the preview window. |
| targetWindow | Assign any window here to redirect the rendering in open. |
| pageCount | Holds the actual number of pages in the preview. |
| clipping | Specifies is clipping should be used to avoid creating too many cell states in large diagrams. |
| Functions | |
| getWindow | Returns wnd. |
| getDocType | Returns the string that should go before the HTML tag in the print preview page. |
| appendGraph | Adds the given graph to the existing print preview. |
| open | Shows the print preview window. |
| addPageBreak | Adds a page break to the given document. |
| closeDocument | Writes the closing tags for body and page after calling writePostfix. |
| writeHead | Writes the HEAD section into the given document, without the opening and closing HEAD tags. |
| writePostfix | Called before closing the body of the page. |
| createPageSelector | Creates the page selector table. |
| renderPage | Creates a DIV that prints a single page of the given graph using the given scale and returns the DIV that represents the page. |
| getRoot | Returns the root cell for painting the graph. |
| addGraphFragment | Adds a graph fragment to the given div. |
| getLinkForCellState | Returns the link for the given cell state. |
| insertBackgroundImage | Inserts the background image into the given div. |
| getCoverPages | Returns the pages to be added before the print output. |
| getAppendices | Returns the pages to be added after the print output. |
| Opens the print preview and shows the print dialog. | |
| close | Closes the print preview window. |
function mxPrintPreview( graph, scale, pageFormat, border, x0, y0, borderColor, title, pageSelector )
Constructs a new print preview for the given parameters.
| graph | mxGraph to be previewed. |
| scale | Optional scale of the output. Default is 1 / mxGraph.pageScale. |
| border | Border in pixels along each side of every page. Note that the actual print function in the browser will add another border for printing. |
| pageFormat | mxRectangle that specifies the page format (in pixels). This should match the page format of the printer. Default uses the mxGraph.pageFormat of the given graph. |
| x0 | Optional left offset of the output. Default is 0. |
| y0 | Optional top offset of the output. Default is 0. |
| borderColor | Optional color of the page border. Default is no border. Note that a border is sometimes useful to highlight the printed page border in the print preview of the browser. |
| title | Optional string that is used for the window title. Default is ‘Printer-friendly version’. |
| pageSelector | Optional boolean that specifies if the page selector should appear in the window with the print preview. Default is true. |
mxPrintPreview.prototype.graph
Reference to the mxGraph that should be previewed.
mxPrintPreview.prototype.pageFormat
Holds the mxRectangle that defines the page format.
mxPrintPreview.prototype.targetWindow
Assign any window here to redirect the rendering in open.
mxPrintPreview.prototype.getWindow = function()
Returns wnd.
mxPrintPreview.prototype.appendGraph = function( graph, scale, x0, y0, forcePageBreaks, keepOpen )
Adds the given graph to the existing print preview.
| css | Optional CSS string to be used in the head section. |
| targetWindow | Optional window that should be used for rendering. If this is specified then no HEAD tag, CSS and BODY tag will be written. |
mxPrintPreview.prototype.open = function( css, targetWindow, forcePageBreaks, keepOpen )
Shows the print preview window. The window is created here if it does not exist.
| css | Optional CSS string to be used in the head section. |
| targetWindow | Optional window that should be used for rendering. If this is specified then no HEAD tag, CSS and BODY tag will be written. |
mxPrintPreview.prototype.closeDocument = function()
Writes the closing tags for body and page after calling writePostfix.
mxPrintPreview.prototype.renderPage = function( w, h, dx, dy, content, pageNumber )
Creates a DIV that prints a single page of the given graph using the given scale and returns the DIV that represents the page.
| w | Width of the page in pixels. |
| h | Height of the page in pixels. |
| dx | Optional horizontal page offset in pixels (used internally). |
| dy | Optional vertical page offset in pixels (used internally). |
| content | Callback that adds the HTML content to the inner div of a page. Takes the inner div as the argument. |
| pageNumber | Integer representing the page number. |
mxPrintPreview.prototype.addGraphFragment = function( dx, dy, scale, pageNumber, div, clip )
Adds a graph fragment to the given div.
| dx | Horizontal translation for the diagram. |
| dy | Vertical translation for the diagram. |
| scale | Scale for the diagram. |
| pageNumber | Number of the page to be rendered. |
| div | Div that contains the output. |
| clip | Contains the clipping rectangle as an mxRectangle. |
Defines the appearance of the cells in a graph. See putCellStyle for an example of creating a new cell style. It is recommended to use objects, not arrays for holding cell styles. Existing styles can be cloned using mxUtils.clone and turned into a string for debugging using mxUtils.toString.
The stylesheet contains two built-in styles, which are used if no style is defined for a cell:
| defaultVertex | Default style for vertices |
| defaultEdge | Default style for edges |
var vertexStyle = stylesheet.getDefaultVertexStyle(); vertexStyle[mxConstants.ROUNDED] = true; var edgeStyle = stylesheet.getDefaultEdgeStyle(); edgeStyle[mxConstants.STYLE_EDGE] = mxEdgeStyle.EntityRelation;
Modifies the built-in default styles.
To avoid the default style for a cell, add a leading semicolon to the style definition, eg.
;shadow=1
For removing a key in a cell style of the form [stylename;|key=value;] the special value none can be used, eg. highlight;fillColor=none
See also the helper methods in mxUtils to modify strings of this format, namely mxUtils.setStyle, mxUtils.indexOfStylename, mxUtils.addStylename, mxUtils.removeStylename, mxUtils.removeAllStylenames and mxUtils.setStyleFlag.
| Functions | |
| mxStylesheet | Constructs a new stylesheet and assigns default styles. |
| styles | Maps from names to cell styles. |
| createDefaultVertexStyle | Creates and returns the default vertex style. |
| createDefaultEdgeStyle | Creates and returns the default edge style. |
| putDefaultVertexStyle | Sets the default style for vertices using defaultVertex as the stylename. |
| putDefaultEdgeStyle | Sets the default style for edges using defaultEdge as the stylename. |
| getDefaultVertexStyle | Returns the default style for vertices. |
| getDefaultEdgeStyle | Sets the default style for edges. |
| putCellStyle | Stores the given map of key, value pairs under the given name in styles. |
| getCellStyle | Returns the cell style for the specified stylename or the given defaultStyle if no style can be found for the given stylename. |
mxStylesheet.prototype.putCellStyle = function( name, style )
Stores the given map of key, value pairs under the given name in styles.
The following example adds a new style called ‘rounded’ into an existing stylesheet:
var style = new Object();
style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_RECTANGLE;
style[mxConstants.STYLE_PERIMETER] = mxPerimeter.RectanglePerimeter;
style[mxConstants.STYLE_ROUNDED] = true;
graph.getStylesheet().putCellStyle('rounded', style);In the above example, the new style is an object. The possible keys of the object are all the constants in mxConstants that start with STYLE and the values are either JavaScript objects, such as <mxPerimeter.RightAngleRectanglePerimeter> (which is in fact a function) or expressions, such as true. Note that not all keys will be interpreted by all shapes (eg. the line shape ignores the fill color). The final call to this method associates the style with a name in the stylesheet. The style is used in a cell with the following code:
model.setStyle(cell, 'rounded');
| name | Name for the style to be stored. |
| style | Key, value pairs that define the style. |
mxStylesheet.prototype.getCellStyle = function( name, defaultStyle )
Returns the cell style for the specified stylename or the given defaultStyle if no style can be found for the given stylename.
| name | String of the form [(stylename|key=value);] that represents the style. |
| defaultStyle | Default style to be returned if no style can be found. |
Represents the current state of a cell in a given mxGraphView.
For edges, the edge label position is stored in absoluteOffset.
The size for oversize labels can be retrieved using the boundingBox property of the text field as shown below.
var bbox = (state.text != null) ? state.text.boundingBox : null;
| Functions | |
| mxCellState | Constructs a new object that represents the current state of the given cell in the specified view. |
| Variables | |
| view | Reference to the enclosing mxGraphView. |
| cell | Reference to the mxCell that is represented by this state. |
| style | Contains an array of key, value pairs that represent the style of the cell. |
| invalidStyle | Specifies if the style is invalid. |
| invalid | Specifies if the state is invalid. |
| origin | mxPoint that holds the origin for all child cells. |
| absolutePoints | Holds an array of mxPoints that represent the absolute points of an edge. |
| absoluteOffset | mxPoint that holds the absolute offset. |
| visibleSourceState | Caches the visible source terminal state. |
| visibleTargetState | Caches the visible target terminal state. |
| terminalDistance | Caches the distance between the end points for an edge. |
| length | Caches the length of an edge. |
| segments | Array of numbers that represent the cached length of each segment of the edge. |
| shape | Holds the mxShape that represents the cell graphically. |
| text | Holds the mxText that represents the label of the cell. |
| unscaledWidth | Holds the unscaled width of the state. |
| Functions | |
| getPerimeterBounds | Returns the mxRectangle that should be used as the perimeter of the cell. |
| setAbsoluteTerminalPoint | Sets the first or last point in absolutePoints depending on isSource. |
| setCursor | Sets the given cursor on the shape and text shape. |
| getVisibleTerminal | Returns the visible source or target terminal cell. |
| getVisibleTerminalState | Returns the visible source or target terminal state. |
| setVisibleTerminalState | Sets the visible source or target terminal state. |
| getCellBounds | Returns the unscaled, untranslated bounds. |
| getPaintBounds | Returns the unscaled, untranslated paint bounds. |
| updateCachedBounds | Updates the cellBounds and paintBounds. |
| setState | Copies all fields from the given state to this state. |
| clone | Returns a clone of this mxPoint. |
| destroy | Destroys the state and all associated resources. |
function mxCellState( view, cell, style )
Constructs a new object that represents the current state of the given cell in the specified view.
| view | mxGraphView that contains the state. |
| cell | mxCell that this state represents. |
| style | Array of key, value pairs that constitute the style. |
mxCellState.prototype.view
Reference to the enclosing mxGraphView.
mxCellState.prototype.cell
Reference to the mxCell that is represented by this state.
mxCellState.prototype.absolutePoints
Holds an array of mxPoints that represent the absolute points of an edge.
mxCellState.prototype.absoluteOffset
mxPoint that holds the absolute offset. For edges, this is the absolute coordinates of the label position. For vertices, this is the offset of the label relative to the top, left corner of the vertex.
mxCellState.prototype.shape
Holds the mxShape that represents the cell graphically.
mxCellState.prototype.text
Holds the mxText that represents the label of the cell. Thi smay be null if the cell has no label.
mxCellState.prototype.getPerimeterBounds = function( border, bounds )
Returns the mxRectangle that should be used as the perimeter of the cell.
| border | Optional border to be added around the perimeter bounds. |
| bounds | Optional mxRectangle to be used as the initial bounds. |
mxCellState.prototype.setAbsoluteTerminalPoint = function( point, isSource )
Sets the first or last point in absolutePoints depending on isSource.
| point | mxPoint that represents the terminal point. |
| isSource | Boolean that specifies if the first or last point should be assigned. |
mxCellState.prototype.setVisibleTerminalState = function( terminalState, source )
Sets the visible source or target terminal state.
| terminalState | mxCellState that represents the terminal. |
| source | Boolean that specifies if the source or target state should be set. |
mxCellState.prototype.getPaintBounds = function()
Returns the unscaled, untranslated paint bounds. This is the same as getCellBounds but with a 90 degree rotation if the shape’s isPaintBoundsInverted returns true.
mxCellState.prototype.clone = function()
Returns a clone of this mxPoint.
Implements the selection model for a graph. Here is a listener that handles all removed selection cells.
graph.getSelectionModel().addListener(mxEvent.CHANGE, function(sender, evt)
{
var cells = evt.getProperty('added');
for (var i = 0; i < cells.length; i++)
{
// Handle cells[i]...
}
});| Events | |
| mxEvent.UNDO | Fires after the selection was changed in changeSelection. |
| mxEvent. | Fires after the selection changes by executing an mxSelectionChange. |
| Functions | |
| mxGraphSelectionModel | Constructs a new graph selection model for the given mxGraph. |
| Variables | |
| doneResource | Specifies the resource key for the status message after a long operation. |
| updatingSelectionResource | Specifies the resource key for the status message while the selection is being updated. |
| graph | Reference to the enclosing mxGraph. |
| singleSelection | Specifies if only one selected item at a time is allowed. |
| Functions | |
| isSingleSelection | Returns singleSelection as a boolean. |
| setSingleSelection | Sets the singleSelection flag. |
| isSelected | Returns true if the given mxCell is selected. |
| isEmpty | Returns true if no cells are currently selected. |
| clear | Clears the selection and fires a <change> event if the selection was not empty. |
| setCell | Selects the specified mxCell using setCells. |
| setCells | Selects the given array of mxCells and fires a <change> event. |
| getFirstSelectableCell | Returns the first selectable cell in the given array of cells. |
| addCell | Adds the given mxCell to the selection and fires a <select> event. |
| addCells | Adds the given array of mxCells to the selection and fires a <select> event. |
| removeCell | Removes the specified mxCell from the selection and fires a <select> event for the remaining cells. |
| removeCells | |
| changeSelection | Inner callback to add the specified mxCell to the selection. |
| cellAdded | Inner callback to add the specified mxCell to the selection. |
| cellRemoved | Inner callback to remove the specified mxCell from the selection. |
Fires after the selection was changed in changeSelection. The <code>edit</code> property contains the mxUndoableEdit which contains the mxSelectionChange.
Fires after the selection changes by executing an mxSelectionChange. The <code>added</code> and <code>removed</code> properties contain arrays of cells that have been added to or removed from the selection, respectively. The names are inverted due to historic reasons. This cannot be changed.
mxGraphSelectionModel.prototype.graph
Reference to the enclosing mxGraph.
mxGraphSelectionModel.prototype.isSingleSelection = function()
Returns singleSelection as a boolean.
mxGraphSelectionModel.prototype.setSingleSelection = function( singleSelection )
Sets the singleSelection flag.
| singleSelection | Boolean that specifies the new value for singleSelection. |
mxGraphSelectionModel.prototype.isSelected = function( cell )
Returns true if the given mxCell is selected.
Action to change the current root in a view.
| Functions | |
| mxCurrentRootChange | Constructs a change of the current root in the given view. |
| execute | Changes the current root of the view. |
In-place editor for the graph. To control this editor, use mxGraph.invokesStopCellEditing, mxGraph.enterStopsCellEditing and mxGraph.escapeEnabled. If mxGraph.enterStopsCellEditing is true then ctrl-enter or shift-enter can be used to create a linefeed. The F2 and escape keys can always be used to stop editing.
To customize the location of the textbox in the graph, override getEditorBounds as follows:
graph.cellEditor.getEditorBounds = function(state)
{
var result = mxCellEditor.prototype.getEditorBounds.apply(this, arguments);
if (this.graph.getModel().isEdge(state.cell))
{
result.x = state.getCenterX() - result.width / 2;
result.y = state.getCenterY() - result.height / 2;
}
return result;
};Note that this hook is only called if autoSize is false. If autoSize is true, then mxShape.getLabelBounds is used to compute the current bounds of the textbox.
The textarea uses the mxCellEditor CSS class. You can modify this class in your custom CSS. Note: You should modify the CSS after loading the client in the page.
To only allow numeric input in the in-place editor, use the following code.
var text = graph.cellEditor.textarea;
mxEvent.addListener(text, 'keydown', function (evt)
{
if (!(evt.keyCode >= 48 && evt.keyCode <= 57) &&
!(evt.keyCode >= 96 && evt.keyCode <= 105))
{
mxEvent.consume(evt);
}
});To implement a placeholder for cells without a label, use the emptyLabelText variable.
Resize of the textarea is disabled by default. If you want to enable this feature extend init and set this.textarea.style.resize = ‘’.
To start editing on a key press event, the container of the graph should have focus or a focusable parent should be used to add the key press handler as follows.
mxEvent.addListener(graph.container, 'keypress', mxUtils.bind(this, function(evt)
{
if (!graph.isEditing() && !graph.isSelectionEmpty() && evt.which !== 0 &&
!mxEvent.isAltDown(evt) && !mxEvent.isControlDown(evt) && !mxEvent.isMetaDown(evt))
{
graph.startEditing();
if (mxClient.IS_FF)
{
graph.cellEditor.textarea.value = String.fromCharCode(evt.which);
}
}
}));To allow focus for a DIV, and hence to receive key press events, some browsers require it to have a valid tabindex attribute. In this case the following code may be used to keep the container focused.
var graphFireMouseEvent = graph.fireMouseEvent;
graph.fireMouseEvent = function(evtName, me, sender)
{
if (evtName == mxEvent.MOUSE_DOWN)
{
this.container.focus();
}
graphFireMouseEvent.apply(this, arguments);
};| Functions | |
| mxCellEditor | Constructs a new in-place editor for the specified graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| textarea | Holds the DIV that is used for text editing. |
| editingCell | Reference to the mxCell that is currently being edited. |
| trigger | Reference to the event that was used to start editing. |
| modified | Specifies if the label has been modified. |
| autoSize | Specifies if the textarea should be resized while the text is being edited. |
| selectText | Specifies if the text should be selected when editing starts. |
| emptyLabelText | Text to be displayed for empty labels. |
| escapeCancelsEditing | If true, pressing the escape key will stop editing and not accept the new value. |
| textNode | Reference to the label DOM node that has been hidden. |
| zIndex | Specifies the zIndex for the textarea. |
| minResize | Defines the minimum width and height to be used in resize. |
| wordWrapPadding | Correction factor for word wrapping width. |
| blurEnabled | If focusLost should be called if textarea loses the focus. |
| initialValue | Holds the initial editing value to check if the current value was modified. |
| align | Holds the current temporary horizontal alignment for the cell style. |
| Functions | |
| init | Creates the textarea and installs the event listeners. |
| applyValue | Called in stopEditing if cancel is false to invoke mxGraph.labelChanged. |
| setAlign | Sets the temporary horizontal alignment for the current editing session. |
| getInitialValue | Gets the initial editing value for the given cell. |
| getCurrentValue | Returns the current editing value. |
| isCancelEditingKeyEvent | Returns true if escapeCancelsEditing is true and shift, control and meta are not pressed. |
| installListeners | Installs listeners for focus, change and standard key event handling. |
| isStopEditingEvent | Returns true if the given keydown event should stop cell editing. |
| isEventSource | Returns true if this editor is the source for the given native event. |
| resize | Returns modified. |
| focusLost | Called if the textarea has lost focus. |
| getBackgroundColor | Returns the background color for the in-place editor. |
| isLegacyEditor | Returns true if max-width is not supported or if the SVG root element in in the graph does not have CSS position absolute. |
| startEditing | Starts the editor for the given cell. |
| isSelectText | Returns selectText. |
| isSelectText | Returns selectText. |
| stopEditing | Stops the editor and applies the value if cancel is false. |
| prepareTextarea | Prepares the textarea for getting its value in stopEditing. |
| isHideLabel | Returns true if the label should be hidden while the cell is being edited. |
| getMinimumSize | Returns the minimum width and height for editing the given state. |
| getEditorBounds | Returns the mxRectangle that defines the bounds of the editor. |
| getEmptyLabelText | Returns the initial label value to be used of the label of the given cell is empty. |
| getEditingCell | Returns the cell that is currently being edited or null if no cell is being edited. |
| destroy | Destroys the editor and removes all associated resources. |
function mxCellEditor( graph )
Constructs a new in-place editor for the specified graph.
| graph | Reference to the enclosing mxGraph. |
mxCellEditor.prototype.graph
Reference to the enclosing mxGraph.
mxCellEditor.prototype.textarea
Holds the DIV that is used for text editing. Note that this may be null before the first edit. Instantiated in init.
mxCellEditor.prototype.editingCell
Reference to the mxCell that is currently being edited.
mxCellEditor.prototype.emptyLabelText
Text to be displayed for empty labels. Default is ‘’ or ‘<br>’ in Firefox as a workaround for the missing cursor bug for empty content editable. This can be set to eg. “[Type Here]” to easier visualize editing of empty labels. The value is only displayed before the first keystroke and is never used as the actual editing value.
mxCellEditor.prototype.minResize
Defines the minimum width and height to be used in resize. Default is 0x20px.
mxCellEditor.prototype.applyValue = function( state, value )
Called in stopEditing if cancel is false to invoke mxGraph.labelChanged.
mxCellEditor.prototype.isCancelEditingKeyEvent = function( evt )
Returns true if escapeCancelsEditing is true and shift, control and meta are not pressed.
mxCellEditor.prototype.isStopEditingEvent = function( evt )
Returns true if the given keydown event should stop cell editing. This returns true if F2 is pressed of if mxGraph.enterStopsCellEditing is true and enter is pressed without control or shift.
mxCellEditor.prototype.resize = function()
Returns modified.
mxCellEditor.prototype.isLegacyEditor = function()
Returns true if max-width is not supported or if the SVG root element in in the graph does not have CSS position absolute. In these cases the text editor must use CSS position absolute to avoid an offset but it will have a less accurate line wrapping width during the text editing preview. This implementation returns true for IE8- and quirks mode or if the CSS position of the SVG element is not absolute.
mxCellEditor.prototype.startEditing = function( cell, trigger )
Starts the editor for the given cell.
| cell | mxCell to start editing. |
| trigger | Optional mouse event that triggered the editor. |
mxCellEditor.prototype.isSelectText = function()
Returns selectText.
Returns selectText.
mxCellEditor.prototype.prepareTextarea = function()
Prepares the textarea for getting its value in stopEditing. This implementation removes the extra trailing linefeed in Firefox.
mxCellEditor.prototype.getEditorBounds = function( state )
Returns the mxRectangle that defines the bounds of the editor.
mxCellEditor.prototype.getEmptyLabelText = function ( cell )
Returns the initial label value to be used of the label of the given cell is empty. This label is displayed and cleared on the first keystroke. This implementation returns emptyLabelText.
| cell | mxCell for which a text for an empty editing box should be returned. |
Renders cells into a document object model. The defaultShapes is a global map of shapename, constructor pairs that is used in all instances. You can get a list of all available shape names using the following code.
In general the cell renderer is in charge of creating, redrawing and destroying the shape and label associated with a cell state, as well as some other graphical objects, namely controls and overlays. The shape hieararchy in the display (ie. the hierarchy in which the DOM nodes appear in the document) does not reflect the cell hierarchy. The shapes are a (flat) sequence of shapes and labels inside the draw pane of the graph view, with some exceptions, namely the HTML labels being placed directly inside the graph container for certain browsers.
mxLog.show();
for (var i in mxCellRenderer.defaultShapes)
{
mxLog.debug(i);
}| Functions | |
| mxCellRenderer | arrow, rectangle, ellipse, rhombus, image, line, label, cylinder, swimlane, connector, actor and cloud. |
| Variables | |
| defaultShapes | Static array that contains the globally registered shapes which are known to all instances of this class. |
| defaultEdgeShape | Defines the default shape for edges. |
| defaultVertexShape | Defines the default shape for vertices. |
| defaultTextShape | Defines the default shape for labels. |
| legacyControlPosition | Specifies if the folding icon should ignore the horizontal orientation of a swimlane. |
| legacySpacing | Specifies if spacing and label position should be ignored if overflow is fill or width. |
| antiAlias | Anti-aliasing option for new shapes. |
| minSvgStrokeWidth | Minimum stroke width for SVG output. |
| forceControlClickHandler | Specifies if the enabled state of the graph should be ignored in the control click handler (to allow folding in disabled graphs). |
| Functions | |
| registerShape | Registers the given constructor under the specified key in this instance of the renderer. |
| initializeShape | Initializes the shape in the given state by calling its init method with the correct container after configuring it using configureShape. |
| createShape | Creates and returns the shape for the given cell state. |
| createIndicatorShape | Creates the indicator shape for the given cell state. |
| getShape | Returns the shape for the given name from defaultShapes. |
| getShapeConstructor | Returns the constructor to be used for creating the shape. |
| configureShape | Configures the shape for the given cell state. |
| postConfigureShape | Replaces any reserved words used for attributes, eg. |
| checkPlaceholderStyles | Resolves special keywords ‘inherit’, ‘indicated’ and ‘swimlane’ and sets the respective color on the shape. |
| resolveColor | Resolves special keywords ‘inherit’, ‘indicated’ and ‘swimlane’ and sets the respective color on the shape. |
| getLabelValue | Returns the value to be used for the label. |
| createLabel | Creates the label for the given cell state. |
| initializeLabel | Initiailzes the label with a suitable container. |
| createCellOverlays | Creates the actual shape for showing the overlay for the given cell state. |
| initializeOverlay | Initializes the given overlay. |
| installOverlayListeners | Installs the listeners for the given mxCellState, mxCellOverlay and mxShape that represents the overlay. |
| createControl | Creates the control for the given cell state. |
| createControlClickHandler | Hook for creating the click handler for the folding icon. |
| initControl | Initializes the given control and returns the corresponding DOM node. |
| isShapeEvent | Returns true if the event is for the shape of the given state. |
| isLabelEvent | Returns true if the event is for the label of the given state. |
| installListeners | Installs the event listeners for the given cell state. |
| redrawLabel | Redraws the label for the given cell state. |
| isTextShapeInvalid | Returns true if the style for the text shape has changed. |
| redrawLabelShape | Called to invoked redraw on the given text shape. |
| getTextScale | Returns the scaling used for the label of the given state |
| getLabelBounds | Returns the bounds to be used to draw the label of the given state. |
| rotateLabelBounds | Adds the shape rotation to the given label bounds and applies the alignment and offsets. |
| redrawCellOverlays | Redraws the overlays for the given cell state. |
| redrawControl | Redraws the control for the given cell state. |
| getControlBounds | Returns the bounds to be used to draw the control (folding icon) of the given state. |
| insertStateAfter | Inserts the given array of mxShapes after the given nodes in the DOM. |
| getShapesForState | Returns the mxShapes for the given cell state in the order in which they should appear in the DOM. |
| redraw | Updates the bounds or points and scale of the shapes for the given cell state. |
| redrawShape | Redraws the shape for the given cell state. |
| doRedrawShape | Invokes redraw on the shape of the given state. |
| isShapeInvalid | Returns true if the given shape must be repainted. |
| destroy | Destroys the shapes associated with the given cell state. |
mxCellRenderer.defaultShapes
Static array that contains the globally registered shapes which are known to all instances of this class. For adding new shapes you should use the static mxCellRenderer.registerShape function.
mxCellRenderer.prototype.defaultEdgeShape
Defines the default shape for edges. Default is mxConnector.
mxCellRenderer.prototype.defaultVertexShape
Defines the default shape for vertices. Default is mxRectangleShape.
mxCellRenderer.prototype.defaultTextShape
Defines the default shape for labels. Default is mxText.
mxCellRenderer.registerShape = function( key, shape )
Registers the given constructor under the specified key in this instance of the renderer.
mxCellRenderer.registerShape(mxConstants.SHAPE_RECTANGLE, mxRectangleShape);
| key | String representing the shape name. |
| shape | Constructor of the mxShape subclass. |
mxCellRenderer.prototype.initializeShape = function( state )
Initializes the shape in the given state by calling its init method with the correct container after configuring it using configureShape.
| state | mxCellState for which the shape should be initialized. |
mxCellRenderer.prototype.createShape = function( state )
Creates and returns the shape for the given cell state.
| state | mxCellState for which the shape should be created. |
mxCellRenderer.prototype.createIndicatorShape = function( state )
Creates the indicator shape for the given cell state.
| state | mxCellState for which the indicator shape should be created. |
mxCellRenderer.prototype.getShape = function( name )
Returns the shape for the given name from defaultShapes.
mxCellRenderer.prototype.configureShape = function( state )
Configures the shape for the given cell state.
| state | mxCellState for which the shape should be configured. |
mxCellRenderer.prototype.getLabelValue = function( state )
Returns the value to be used for the label.
| state | mxCellState for which the label should be created. |
mxCellRenderer.prototype.createLabel = function( state, value )
Creates the label for the given cell state.
| state | mxCellState for which the label should be created. |
mxCellRenderer.prototype.initializeLabel = function( state, shape )
Initiailzes the label with a suitable container.
| state | mxCellState whose label should be initialized. |
mxCellRenderer.prototype.createCellOverlays = function( state )
Creates the actual shape for showing the overlay for the given cell state.
| state | mxCellState for which the overlay should be created. |
mxCellRenderer.prototype.initializeOverlay = function( state, overlay )
Initializes the given overlay.
| state | mxCellState for which the overlay should be created. |
| overlay | mxImageShape that represents the overlay. |
Installs the listeners for the given mxCellState, mxCellOverlay and mxShape that represents the overlay.
mxCellRenderer.prototype.createControl = function( state )
Creates the control for the given cell state.
| state | mxCellState for which the control should be created. |
mxCellRenderer.prototype.createControlClickHandler = function( state )
Hook for creating the click handler for the folding icon.
| state | mxCellState whose control click handler should be returned. |
mxCellRenderer.prototype.initControl = function( state, control, handleEvents, clickHandler )
Initializes the given control and returns the corresponding DOM node.
| state | mxCellState for which the control should be initialized. |
| control | mxShape to be initialized. |
| handleEvents | Boolean indicating if mousedown and mousemove should fire events via the graph. |
| clickHandler | Optional function to implement clicks on the control. |
mxCellRenderer.prototype.isShapeEvent = function( state, evt )
Returns true if the event is for the shape of the given state. This implementation always returns true.
| state | mxCellState whose shape fired the event. |
| evt | Mouse event which was fired. |
mxCellRenderer.prototype.isLabelEvent = function( state, evt )
Returns true if the event is for the label of the given state. This implementation always returns true.
| state | mxCellState whose label fired the event. |
| evt | Mouse event which was fired. |
mxCellRenderer.prototype.installListeners = function( state )
Installs the event listeners for the given cell state.
| state | mxCellState for which the event listeners should be isntalled. |
mxCellRenderer.prototype.redrawLabel = function( state, forced )
Redraws the label for the given cell state.
| state | mxCellState whose label should be redrawn. |
mxCellRenderer.prototype.isTextShapeInvalid = function( state, shape )
Returns true if the style for the text shape has changed.
| state | mxCellState whose label should be checked. |
| shape | mxText shape to be checked. |
mxCellRenderer.prototype.redrawLabelShape = function( shape )
Called to invoked redraw on the given text shape.
| shape | mxText shape to be redrawn. |
mxCellRenderer.prototype.getTextScale = function( state )
Returns the scaling used for the label of the given state
| state | mxCellState whose label scale should be returned. |
mxCellRenderer.prototype.getLabelBounds = function( state )
Returns the bounds to be used to draw the label of the given state.
| state | mxCellState whose label bounds should be returned. |
mxCellRenderer.prototype.rotateLabelBounds = function( state, bounds )
Adds the shape rotation to the given label bounds and applies the alignment and offsets.
| state | mxCellState whose label bounds should be rotated. |
| bounds | mxRectangle the rectangle to be rotated. |
mxCellRenderer.prototype.redrawCellOverlays = function( state, forced )
Redraws the overlays for the given cell state.
| state | mxCellState whose overlays should be redrawn. |
mxCellRenderer.prototype.redrawControl = function( state, forced )
Redraws the control for the given cell state.
| state | mxCellState whose control should be redrawn. |
mxCellRenderer.prototype.insertStateAfter = function( state, node, htmlNode )
Inserts the given array of mxShapes after the given nodes in the DOM.
| shapes | Array of mxShapes to be inserted. |
| node | Node in <drawPane> after which the shapes should be inserted. |
| htmlNode | Node in the graph container after which the shapes should be inserted that will not go into the <drawPane> (eg. HTML labels without foreignObjects). |
mxCellRenderer.prototype.getShapesForState = function( state )
Returns the mxShapes for the given cell state in the order in which they should appear in the DOM.
| state | mxCellState whose shapes should be returned. |
mxCellRenderer.prototype.redraw = function( state, force, rendering )
Updates the bounds or points and scale of the shapes for the given cell state. This is called in mxGraphView.validatePoints as the last step of updating all cells.
| state | mxCellState for which the shapes should be updated. |
| force | Optional boolean that specifies if the cell should be reconfiured and redrawn without any additional checks. |
| rendering | Optional boolean that specifies if the cell should actually be drawn into the DOM. If this is false then redraw and/or reconfigure will not be called on the shape. |
mxCellRenderer.prototype.redrawShape = function( state, force, rendering )
Redraws the shape for the given cell state.
| state | mxCellState whose label should be redrawn. |
mxCellRenderer.prototype.destroy = function( state )
Destroys the shapes associated with the given cell state.
| state | mxCellState for which the shapes should be destroyed. |
Provides various edge styles to be used as the values for mxConstants.STYLE_EDGE in a cell style.
var style = stylesheet.getDefaultEdgeStyle(); style[mxConstants.STYLE_EDGE] = mxEdgeStyle.ElbowConnector;
Sets the default edge style to ElbowConnector.
To write a custom edge style, a function must be added to the mxEdgeStyle object as follows:
mxEdgeStyle.MyStyle = function(state, source, target, points, result)
{
if (source != null && target != null)
{
var pt = new mxPoint(target.getCenterX(), source.getCenterY());
if (mxUtils.contains(source, pt.x, pt.y))
{
pt.y = source.y + source.height;
}
result.push(pt);
}
};In the above example, a right angle is created using a point on the horizontal center of the target vertex and the vertical center of the source vertex. The code checks if that point intersects the source vertex and makes the edge straight if it does. The point is then added into the result array, which acts as the return value of the function.
mxStyleRegistry.putValue('myEdgeStyle', mxEdgeStyle.MyStyle);model.setStyle(edge, 'edgeStyle=myEdgeStyle');
Note that the key of the mxStyleRegistry entry for the function should be used in string values, unless mxGraphView.allowEval is true, in which case you can also use mxEdgeStyle.MyStyle for the value in the cell style above.
var style = graph.getStylesheet().getDefaultEdgeStyle(); style[mxConstants.STYLE_EDGE] = mxEdgeStyle.MyStyle;
Note that the object can be used directly when programmatically setting the value, but the key in the mxStyleRegistry should be used when setting the value via a key, value pair in a cell style.
| Functions | |
| EntityRelation | Implements an entity relation style for edges (as used in database schema diagrams). |
| Loop | Implements a self-reference, aka. |
| ElbowConnector | Uses either SideToSide or TopToBottom depending on the horizontal flag in the cell style. |
| SideToSide | Implements a vertical elbow edge. |
| TopToBottom | Implements a horizontal elbow edge. |
| SegmentConnector | Implements an orthogonal edge style. |
| OrthConnector | Implements a local orthogonal router between the given cells. |
EntityRelation: function ( state, source, target, points, result )
Implements an entity relation style for edges (as used in database schema diagrams). At the time the function is called, the result array contains a placeholder (null) for the first absolute point, that is, the point where the edge and source terminal are connected. The implementation of the style then adds all intermediate waypoints except for the last point, that is, the connection point between the edge and the target terminal. The first ant the last point in the result array are then replaced with mxPoints that take into account the terminal’s perimeter and next point on the edge.
| state | mxCellState that represents the edge to be updated. |
| source | mxCellState that represents the source terminal. |
| target | mxCellState that represents the target terminal. |
| points | List of relative control points. |
| result | Array of mxPoints that represent the actual points of the edge. |
ElbowConnector: function ( state, source, target, points, result )
Uses either SideToSide or TopToBottom depending on the horizontal flag in the cell style. SideToSide is used if horizontal is true or unspecified. See EntityRelation for a description of the parameters.
SideToSide: function ( state, source, target, points, result )
Implements a vertical elbow edge. See EntityRelation for a description of the parameters.
TopToBottom: function( state, source, target, points, result )
Implements a horizontal elbow edge. See EntityRelation for a description of the parameters.
OrthConnector: function( state, source, target, points, result )
Implements a local orthogonal router between the given cells.
| state | mxCellState that represents the edge to be updated. |
| source | mxCellState that represents the source terminal. |
| target | mxCellState that represents the target terminal. |
| points | List of relative control points. |
| result | Array of mxPoints that represent the actual points of the edge. |
Extends mxEventSource to implement a view for a graph. This class is in charge of computing the absolute coordinates for the relative child geometries, the points for perimeters and edge styles and keeping them cached in mxCellStates for faster retrieval. The states are updated whenever the model or the view state (translate, scale) changes. The scale and translate are honoured in the bounds.
| Events | |
| mxEvent.UNDO | Fires after the root was changed in setCurrentRoot. |
| mxEvent. | Fires after the scale and translate have been changed in scaleAndTranslate. |
| mxEvent. | Fires after the scale was changed in setScale. |
| mxEvent. | Fires after the translate was changed in setTranslate. |
| mxEvent. | Fire if the current root is changed by executing an mxCurrentRootChange. |
| Functions | |
| mxGraphView | Constructs a new view for the given mxGraph. |
| Variables | |
| doneResource | Specifies the resource key for the status message after a long operation. |
| Functions | |
| updatingDocumentResource | Specifies the resource key for the status message while the document is being updated. |
| Variables | |
| allowEval | Specifies if string values in cell styles should be evaluated using mxUtils.eval. |
| captureDocumentGesture | Specifies if a gesture should be captured when it goes outside of the graph container. |
| optimizeVmlReflows | Specifies if the <canvas> should be hidden while rendering in IE8 standards mode and quirks mode. |
| rendering | Specifies if shapes should be created, updated and destroyed using the methods of mxCellRenderer in graph. |
| graph | Reference to the enclosing mxGraph. |
| currentRoot | mxCell that acts as the root of the displayed cell hierarchy. |
| graphBounds | mxRectangle that caches the scales, translated bounds of the current view. |
| scale | Specifies the scale. |
| translate | mxPoint that specifies the current translation. |
| states | mxDictionary that maps from cell IDs to mxCellStates. |
| updateStyle | Specifies if the style should be updated in each validation step. |
| lastNode | During validation, this contains the last DOM node that was processed. |
| lastHtmlNode | During validation, this contains the last HTML DOM node that was processed. |
| lastForegroundNode | During validation, this contains the last edge’s DOM node that was processed. |
| lastForegroundHtmlNode | During validation, this contains the last edge HTML DOM node that was processed. |
| Functions | |
| getGraphBounds | Returns graphBounds. |
| setGraphBounds | Sets graphBounds. |
| getBounds | Returns the union of all mxCellStates for the given array of mxCells. |
| setCurrentRoot | Sets and returns the current root and fires an <undo> event before calling mxGraph.sizeDidChange. |
| scaleAndTranslate | Sets the scale and translation and fires a scale and translate event before calling revalidate followed by mxGraph.sizeDidChange. |
| getScale | Returns the scale. |
| setScale | Sets the scale and fires a scale event before calling revalidate followed by mxGraph.sizeDidChange. |
| getTranslate | Returns the translate. |
| setTranslate | Sets the translation and fires a translate event before calling revalidate followed by mxGraph.sizeDidChange. |
| viewStateChanged | Invoked after scale and/or translate has changed. |
| refresh | Clears the view if currentRoot is not null and revalidates. |
| revalidate | Revalidates the complete view with all cell states. |
| clear | Removes the state of the given cell and all descendants if the given cell is not the current root. |
| invalidate | Invalidates the state of the given cell, all its descendants and connected edges. |
| validate | Calls validateCell and validateCellState and updates the graphBounds using getBoundingBox. |
| getEmptyBounds | Returns the bounds for an empty graph. |
| getBoundingBox | Returns the bounding box of the shape and the label for the given mxCellState and its children if recurse is true. |
| createBackgroundPageShape | Creates and returns the shape used as the background page. |
| validateBackground | Calls validateBackgroundImage and validateBackgroundPage. |
| validateBackgroundImage | Validates the background image. |
| validateBackgroundPage | Validates the background page. |
| getBackgroundPageBounds | Returns the bounds for the background page. |
| redrawBackgroundImage | Updates the bounds and redraws the background image. |
| validateCell | Recursively creates the cell state for the given cell if visible is true and the given cell is visible. |
| validateCellState | Validates and repaints the mxCellState for the given mxCell. |
| updateCellState | Updates the given mxCellState. |
| isCellCollapsed | Returns true if the children of the given cell should not be visible in the view. |
| updateVertexState | Validates the given cell state. |
| updateEdgeState | Validates the given cell state. |
| updateVertexLabelOffset | Updates the absoluteOffset of the given vertex cell state. |
| resetValidationState | Resets the current validation state. |
| stateValidated | Invoked when a state has been processed in <validatePoints>. |
| updateFixedTerminalPoints | Sets the initial absolute terminal points in the given state before the edge style is computed. |
| updateFixedTerminalPoint | Sets the fixed source or target terminal point on the given edge. |
| getFixedTerminalPoint | Returns the fixed source or target terminal point for the given edge. |
| updateBoundsFromStencil | Updates the bounds of the given cell state to reflect the bounds of the stencil if it has a fixed aspect and returns the previous bounds as an mxRectangle if the bounds have been modified or null otherwise. |
| updatePoints | Updates the absolute points in the given state using the specified array of mxPoints as the relative points. |
| transformControlPoint | Transforms the given control point to an absolute point. |
| isLoopStyleEnabled | Returns true if the given edge should be routed with mxGraph.defaultLoopStyle or the mxConstants.STYLE_LOOP defined for the given edge. |
| getEdgeStyle | Returns the edge style function to be used to render the given edge state. |
| updateFloatingTerminalPoints | Updates the terminal points in the given state after the edge style was computed for the edge. |
| updateFloatingTerminalPoint | Updates the absolute terminal point in the given state for the given start and end state, where start is the source if source is true. |
| getFloatingTerminalPoint | Returns the floating terminal point for the given edge, start and end state, where start is the source if source is true. |
| getTerminalPort | Returns an mxCellState that represents the source or target terminal or port for the given edge. |
| getPerimeterPoint | Returns an mxPoint that defines the location of the intersection point between the perimeter and the line between the center of the shape and the given point. |
| getRoutingCenterX | Returns the x-coordinate of the center point for automatic routing. |
| getRoutingCenterY | Returns the y-coordinate of the center point for automatic routing. |
| getPerimeterBounds | Returns the perimeter bounds for the given terminal, edge pair as an mxRectangle. |
| getPerimeterFunction | Returns the perimeter function for the given state. |
| getNextPoint | Returns the nearest point in the list of absolute points or the center of the opposite terminal. |
| getVisibleTerminal | Returns the nearest ancestor terminal that is visible. |
| updateEdgeBounds | Updates the given state using the bounding box of t he absolute points. |
| getPoint | Returns the absolute point on the edge for the given relative mxGeometry as an mxPoint. |
| getRelativePoint | Gets the relative point that describes the given, absolute label position for the given edge state. |
| updateEdgeLabelOffset | Updates mxCellState.absoluteOffset for the given state. |
| getState | Returns the mxCellState for the given cell. |
| isRendering | Returns rendering. |
| setRendering | Sets rendering. |
| isAllowEval | Returns allowEval. |
| setAllowEval | Sets allowEval. |
| getStates | Returns states. |
| setStates | Sets states. |
| getCellStates | Returns the mxCellStates for the given array of mxCells. |
| removeState | Removes and returns the mxCellState for the given cell. |
| createState | Creates and returns an mxCellState for the given cell and initializes it using <mxCellRenderer.initialize>. |
| getCanvas | Returns the DOM node that contains the background-, draw- and overlay- and decoratorpanes. |
| getBackgroundPane | Returns the DOM node that represents the background layer. |
| getDrawPane | Returns the DOM node that represents the main drawing layer. |
| getOverlayPane | Returns the DOM node that represents the layer above the drawing layer. |
| getDecoratorPane | Returns the DOM node that represents the topmost drawing layer. |
| isContainerEvent | Returns true if the event origin is one of the drawing panes or containers of the view. |
| isScrollEvent | Returns true if the event origin is one of the scrollbars of the container in IE. |
| init | Initializes the graph event dispatch loop for the specified container and invokes create to create the required DOM nodes for the display. |
| installListeners | Installs the required listeners in the container. |
| create | Creates the DOM nodes for the HTML display. |
| updateHtmlCanvasSize | Updates the size of the HTML canvas. |
| createHtmlPane | Creates and returns a drawing pane in HTML (DIV). |
| create | Creates the DOM nodes for the VML display. |
| createVmlPane | Creates a drawing pane in VML (group). |
| create | Creates and returns the DOM nodes for the SVG display. |
| updateContainerStyle | Updates the style of the container after installing the SVG DOM elements. |
| destroy | Destroys the view and all its resources. |
Fires after the root was changed in setCurrentRoot. The <code>edit</code> property contains the mxUndoableEdit which contains the mxCurrentRootChange.
Fires after the scale and translate have been changed in scaleAndTranslate. The <code>scale</code>, <code>previousScale</code>, <code>translate</code> and <code>previousTranslate</code> properties contain the new and previous scale and translate, respectively.
Fires after the scale was changed in setScale. The <code>scale</code> and <code>previousScale</code> properties contain the new and previous scale.
Fires after the translate was changed in setTranslate. The <code>translate</code> and <code>previousTranslate</code> properties contain the new and previous value for translate.
Fire if the current root is changed by executing an mxCurrentRootChange. The event name depends on the location of the root in the cell hierarchy with respect to the current root. The <code>root</code> and <code>previous</code> properties contain the new and previous root, respectively.
mxGraphView.prototype.allowEval
Specifies if string values in cell styles should be evaluated using mxUtils.eval. This will only be used if the string values can’t be mapped to objects using mxStyleRegistry. Default is false. NOTE: Enabling this switch carries a possible security risk.
mxGraphView.prototype.rendering
Specifies if shapes should be created, updated and destroyed using the methods of mxCellRenderer in graph. Default is true.
mxGraphView.prototype.graph
Reference to the enclosing mxGraph.
mxGraphView.prototype.currentRoot
mxCell that acts as the root of the displayed cell hierarchy.
mxGraphView.prototype.graphBounds
mxRectangle that caches the scales, translated bounds of the current view.
mxGraphView.prototype.states
mxDictionary that maps from cell IDs to mxCellStates.
mxGraphView.prototype.getGraphBounds = function()
Returns graphBounds.
mxGraphView.prototype.setGraphBounds = function( value )
Sets graphBounds.
mxGraphView.prototype.getBounds = function( cells )
Returns the union of all mxCellStates for the given array of mxCells.
| cells | Array of mxCells whose bounds should be returned. |
mxGraphView.prototype.setCurrentRoot = function( root )
Sets and returns the current root and fires an <undo> event before calling mxGraph.sizeDidChange.
| root | mxCell that specifies the root of the displayed cell hierarchy. |
mxGraphView.prototype.scaleAndTranslate = function( scale, dx, dy )
Sets the scale and translation and fires a scale and translate event before calling revalidate followed by mxGraph.sizeDidChange.
| scale | Decimal value that specifies the new scale (1 is 100%). |
| dx | X-coordinate of the translation. |
| dy | Y-coordinate of the translation. |
mxGraphView.prototype.getScale = function()
Returns the scale.
mxGraphView.prototype.setScale = function( value )
Sets the scale and fires a scale event before calling revalidate followed by mxGraph.sizeDidChange.
| value | Decimal value that specifies the new scale (1 is 100%). |
mxGraphView.prototype.getTranslate = function()
Returns the translate.
mxGraphView.prototype.setTranslate = function( dx, dy )
Sets the translation and fires a translate event before calling revalidate followed by mxGraph.sizeDidChange. The translation is the negative of the origin.
| dx | X-coordinate of the translation. |
| dy | Y-coordinate of the translation. |
mxGraphView.prototype.refresh = function()
Clears the view if currentRoot is not null and revalidates.
mxGraphView.prototype.clear = function( cell, force, recurse )
Removes the state of the given cell and all descendants if the given cell is not the current root.
| cell | Optional mxCell for which the state should be removed. Default is the root of the model. |
| force | Boolean indicating if the current root should be ignored for recursion. |
mxGraphView.prototype.invalidate = function( cell, recurse, includeEdges )
Invalidates the state of the given cell, all its descendants and connected edges.
| cell | Optional mxCell to be invalidated. Default is the root of the model. |
mxGraphView.prototype.validate = function( cell )
Calls validateCell and validateCellState and updates the graphBounds using getBoundingBox. Finally the background is validated using validateBackground.
| cell | Optional mxCell to be used as the root of the validation. Default is currentRoot or the root of the model. |
mxGraphView.prototype.getEmptyBounds = function()
Returns the bounds for an empty graph. This returns a rectangle at translate with the size of 0 x 0.
mxGraphView.prototype.getBoundingBox = function( state, recurse )
Returns the bounding box of the shape and the label for the given mxCellState and its children if recurse is true.
| state | mxCellState whose bounding box should be returned. |
| recurse | Optional boolean indicating if the children should be included. Default is true. |
mxGraphView.prototype.createBackgroundPageShape = function( bounds )
Creates and returns the shape used as the background page.
| bounds | mxRectangle that represents the bounds of the shape. |
mxGraphView.prototype.validateBackground = function()
Calls validateBackgroundImage and validateBackgroundPage.
mxGraphView.prototype.redrawBackgroundImage = function( backgroundImage, bg )
Updates the bounds and redraws the background image.
If the background image should not be scaled, this can be replaced with the following.
mxGraphView.prototype.redrawBackground = function(backgroundImage, bg)
{
backgroundImage.bounds.x = this.translate.x;
backgroundImage.bounds.y = this.translate.y;
backgroundImage.bounds.width = bg.width;
backgroundImage.bounds.height = bg.height;
backgroundImage.redraw();
};| backgroundImage | mxImageShape that represents the background image. |
| bg | mxImage that specifies the image and its dimensions. |
mxGraphView.prototype.validateCell = function( cell, visible )
Recursively creates the cell state for the given cell if visible is true and the given cell is visible. If the cell is not visible but the state exists then it is removed using removeState.
| cell | mxCell whose mxCellState should be created. |
| visible | Optional boolean indicating if the cell should be visible. Default is true. |
mxGraphView.prototype.validateCellState = function( cell, recurse )
Validates and repaints the mxCellState for the given mxCell.
| cell | mxCell whose mxCellState should be validated. |
| recurse | Optional boolean indicating if the children of the cell should be validated. Default is true. |
mxGraphView.prototype.updateCellState = function( state )
Updates the given mxCellState.
| state | mxCellState to be updated. |
mxGraphView.prototype.isCellCollapsed = function( cell )
Returns true if the children of the given cell should not be visible in the view. This implementation uses mxGraph.isCellVisible but it can be overidden to use a separate condition.
mxGraphView.prototype.updateVertexLabelOffset = function( state )
Updates the absoluteOffset of the given vertex cell state. This takes into account the label position styles.
| state | mxCellState whose absolute offset should be updated. |
mxGraphView.prototype.stateValidated = function( state )
Invoked when a state has been processed in <validatePoints>. This is used to update the order of the DOM nodes of the shape.
| state | mxCellState that represents the cell state. |
mxGraphView.prototype.updateFixedTerminalPoints = function( edge, source, target )
Sets the initial absolute terminal points in the given state before the edge style is computed.
| edge | mxCellState whose initial terminal points should be updated. |
| source | mxCellState which represents the source terminal. |
| target | mxCellState which represents the target terminal. |
mxGraphView.prototype.updateFixedTerminalPoint = function( edge, terminal, source, constraint )
Sets the fixed source or target terminal point on the given edge.
| edge | mxCellState whose terminal point should be updated. |
| terminal | mxCellState which represents the actual terminal. |
| source | Boolean that specifies if the terminal is the source. |
| constraint | mxConnectionConstraint that specifies the connection. |
mxGraphView.prototype.getFixedTerminalPoint = function( edge, terminal, source, constraint )
Returns the fixed source or target terminal point for the given edge.
| edge | mxCellState whose terminal point should be returned. |
| terminal | mxCellState which represents the actual terminal. |
| source | Boolean that specifies if the terminal is the source. |
| constraint | mxConnectionConstraint that specifies the connection. |
mxGraphView.prototype.updateBoundsFromStencil = function( state )
Updates the bounds of the given cell state to reflect the bounds of the stencil if it has a fixed aspect and returns the previous bounds as an mxRectangle if the bounds have been modified or null otherwise.
| edge | mxCellState whose bounds should be updated. |
mxGraphView.prototype.updatePoints = function( edge, points, source, target )
Updates the absolute points in the given state using the specified array of mxPoints as the relative points.
| edge | mxCellState whose absolute points should be updated. |
| points | Array of mxPoints that constitute the relative points. |
| source | mxCellState that represents the source terminal. |
| target | mxCellState that represents the target terminal. |
mxGraphView.prototype.isLoopStyleEnabled = function( edge, points, source, target )
Returns true if the given edge should be routed with mxGraph.defaultLoopStyle or the mxConstants.STYLE_LOOP defined for the given edge. This implementation returns true if the given edge is a loop and does not have connections constraints associated.
mxGraphView.prototype.updateFloatingTerminalPoints = function( state, source, target )
Updates the terminal points in the given state after the edge style was computed for the edge.
| state | mxCellState whose terminal points should be updated. |
| source | mxCellState that represents the source terminal. |
| target | mxCellState that represents the target terminal. |
mxGraphView.prototype.updateFloatingTerminalPoint = function( edge, start, end, source )
Updates the absolute terminal point in the given state for the given start and end state, where start is the source if source is true.
| edge | mxCellState whose terminal point should be updated. |
| start | mxCellState for the terminal on “this” side of the edge. |
| end | mxCellState for the terminal on the other side of the edge. |
| source | Boolean indicating if start is the source terminal state. |
mxGraphView.prototype.getFloatingTerminalPoint = function( edge, start, end, source )
Returns the floating terminal point for the given edge, start and end state, where start is the source if source is true.
| edge | mxCellState whose terminal point should be returned. |
| start | mxCellState for the terminal on “this” side of the edge. |
| end | mxCellState for the terminal on the other side of the edge. |
| source | Boolean indicating if start is the source terminal state. |
mxGraphView.prototype.getTerminalPort = function( state, terminal, source )
Returns an mxCellState that represents the source or target terminal or port for the given edge.
| state | mxCellState that represents the state of the edge. |
| terminal | mxCellState that represents the terminal. |
| source | Boolean indicating if the given terminal is the source terminal. |
mxGraphView.prototype.getPerimeterPoint = function( terminal, next, orthogonal, border )
Returns an mxPoint that defines the location of the intersection point between the perimeter and the line between the center of the shape and the given point.
| terminal | mxCellState for the source or target terminal. |
| next | mxPoint that lies outside of the given terminal. |
| orthogonal | Boolean that specifies if the orthogonal projection onto the perimeter should be returned. If this is false then the intersection of the perimeter and the line between the next and the center point is returned. |
| border | Optional border between the perimeter and the shape. |
mxGraphView.prototype.getPerimeterBounds = function( terminal, border )
Returns the perimeter bounds for the given terminal, edge pair as an mxRectangle.
If you have a model where each terminal has a relative child that should act as the graphical endpoint for a connection from/to the terminal, then this method can be replaced as follows:
var oldGetPerimeterBounds = mxGraphView.prototype.getPerimeterBounds;
mxGraphView.prototype.getPerimeterBounds = function(terminal, edge, isSource)
{
var model = this.graph.getModel();
var childCount = model.getChildCount(terminal.cell);
if (childCount > 0)
{
var child = model.getChildAt(terminal.cell, 0);
var geo = model.getGeometry(child);
if (geo != null &&
geo.relative)
{
var state = this.getState(child);
if (state != null)
{
terminal = state;
}
}
}
return oldGetPerimeterBounds.apply(this, arguments);
};| terminal | mxCellState that represents the terminal. |
| border | Number that adds a border between the shape and the perimeter. |
mxGraphView.prototype.getNextPoint = function( edge, opposite, source )
Returns the nearest point in the list of absolute points or the center of the opposite terminal.
| edge | mxCellState that represents the edge. |
| opposite | mxCellState that represents the opposite terminal. |
| source | Boolean indicating if the next point for the source or target should be returned. |
mxGraphView.prototype.getVisibleTerminal = function( edge, source )
Returns the nearest ancestor terminal that is visible. The edge appears to be connected to this terminal on the display. The result of this method is cached in mxCellState.getVisibleTerminalState.
| edge | mxCell whose visible terminal should be returned. |
| source | Boolean that specifies if the source or target terminal should be returned. |
mxGraphView.prototype.updateEdgeBounds = function( state )
Updates the given state using the bounding box of t he absolute points. Also updates mxCellState.terminalDistance, mxCellState.length and mxCellState.segments.
| state | mxCellState whose bounds should be updated. |
mxGraphView.prototype.getPoint = function( state, geometry )
Returns the absolute point on the edge for the given relative mxGeometry as an mxPoint. The edge is represented by the given mxCellState.
| state | mxCellState that represents the state of the parent edge. |
| geometry | mxGeometry that represents the relative location. |
mxGraphView.prototype.getRelativePoint = function( edgeState, x, y )
Gets the relative point that describes the given, absolute label position for the given edge state.
| state | mxCellState that represents the state of the parent edge. |
| x | Specifies the x-coordinate of the absolute label location. |
| y | Specifies the y-coordinate of the absolute label location. |
mxGraphView.prototype.updateEdgeLabelOffset = function( state )
Updates mxCellState.absoluteOffset for the given state. The absolute offset is normally used for the position of the edge label. Is is calculated from the geometry as an absolute offset from the center between the two endpoints if the geometry is absolute, or as the relative distance between the center along the line and the absolute orthogonal distance if the geometry is relative.
| state | mxCellState whose absolute offset should be updated. |
mxGraphView.prototype.getState = function( cell, create )
Returns the mxCellState for the given cell. If create is true, then the state is created if it does not yet exist.
| cell | mxCell for which the mxCellState should be returned. |
| create | Optional boolean indicating if a new state should be created if it does not yet exist. Default is false. |
mxGraphView.prototype.isRendering = function()
Returns rendering.
mxGraphView.prototype.setRendering = function( value )
Sets rendering.
mxGraphView.prototype.isAllowEval = function()
Returns allowEval.
mxGraphView.prototype.setAllowEval = function( value )
Sets allowEval.
mxGraphView.prototype.getStates = function()
Returns states.
mxGraphView.prototype.setStates = function( value )
Sets states.
mxGraphView.prototype.getCellStates = function( cells )
Returns the mxCellStates for the given array of mxCells. The array contains all states that are not null, that is, the returned array may have less elements than the given array. If no argument is given, then this returns states.
mxGraphView.prototype.removeState = function( cell )
Removes and returns the mxCellState for the given cell.
| cell | mxCell for which the mxCellState should be removed. |
mxGraphView.prototype.createState = function( cell )
Creates and returns an mxCellState for the given cell and initializes it using <mxCellRenderer.initialize>.
| cell | mxCell for which a new mxCellState should be created. |
mxGraphView.prototype.init = function()
Initializes the graph event dispatch loop for the specified container and invokes create to create the required DOM nodes for the display.
Action to change the current root in a view.
| Functions | |
| mxCurrentRootChange | Constructs a change of the current root in the given view. |
| execute | Changes the current root of the view. |
Extends mxEventSource to implement a graph component for the browser. This is the main class of the package. To activate panning and connections use setPanning and setConnectable. For rubberband selection you must create a new instance of mxRubberband. The following listeners are added to mouseListeners by default:
These listeners will be called in the above order if they are enabled.
To display a background image, set the image, image width and image height using setBackgroundImage. If one of the above values has changed then the view’s mxGraphView.validate should be invoked.
To use images in cells, a shape must be specified in the default vertex style (or any named style). Possible shapes are mxConstants.SHAPE_IMAGE and mxConstants.SHAPE_LABEL. The code to change the shape used in the default vertex style, the following code is used:
var style = graph.getStylesheet().getDefaultVertexStyle(); style[mxConstants.STYLE_SHAPE] = mxConstants.SHAPE_IMAGE;
For the default vertex style, the image to be displayed can be specified in a cell’s style using the mxConstants.STYLE_IMAGE key and the image URL as a value, for example:
image=http://www.example.com/image.gif
For a named style, the the stylename must be the first element of the cell style:
stylename;image=http://www.example.com/image.gif
A cell style can have any number of key=value pairs added, divided by a semicolon as follows:
[stylename;|key=value;]
The cell labels are defined by getLabel which uses convertValueToString if labelsVisible is true. If a label must be rendered as HTML markup, then isHtmlLabel should return true for the respective cell. If all labels contain HTML markup, htmlLabels can be set to true. NOTE: Enabling HTML labels carries a possible security risk (see the section on security in the manual).
If wrapping is needed for a label, then isHtmlLabel and isWrapping must return true for the cell whose label should be wrapped. See isWrapping for an example.
If clipping is needed to keep the rendering of a HTML label inside the bounds of its vertex, then <isClipping> should return true for the respective cell.
By default, edge labels are movable and vertex labels are fixed. This can be changed by setting edgeLabelsMovable and vertexLabelsMovable, or by overriding isLabelMovable.
In-place editing is started with a doubleclick or by typing F2. Programmatically, <edit> is used to check if the cell is editable (isCellEditable) and call startEditingAtCell, which invokes mxCellEditor.startEditing. The editor uses the value returned by getEditingValue as the editing value.
After in-place editing, labelChanged is called, which invokes mxGraphModel.setValue, which in turn calls mxGraphModel.valueForCellChanged via mxValueChange.
The event that triggers in-place editing is passed through to the cellEditor, which may take special actions depending on the type of the event or mouse location, and is also passed to getEditingValue. The event is then passed back to the event processing functions which can perform specific actions based on the trigger event.
Tooltips are implemented by getTooltip, which calls getTooltipForCell if a cell is under the mousepointer. The default implementation checks if the cell has a getTooltip function and calls it if it exists. Hence, in order to provide custom tooltips, the cell must provide a getTooltip function, or one of the two above functions must be overridden.
Typically, for custom cell tooltips, the latter function is overridden as follows:
graph.getTooltipForCell = function(cell)
{
var label = this.convertValueToString(cell);
return 'Tooltip for '+label;
}When using a config file, the function is overridden in the mxGraph section using the following entry:
<add as="getTooltipForCell"><![CDATA[
function(cell)
{
var label = this.convertValueToString(cell);
return 'Tooltip for '+label;
}
]]></add>”this” refers to the graph in the implementation, so for example to check if a cell is an edge, you use this.getModel().isEdge(cell)
For replacing the default implementation of getTooltipForCell (rather than replacing the function on a specific instance), the following code should be used after loading the JavaScript files, but before creating a new mxGraph instance using mxGraph:
mxGraph.prototype.getTooltipForCell = function(cell)
{
var label = this.convertValueToString(cell);
return 'Tooltip for '+label;
}The implementation of new shapes is demonstrated in the examples. We’ll assume that we have implemented a custom shape with the name BoxShape which we want to use for drawing vertices. To use this shape, it must first be registered in the cell renderer as follows:
mxCellRenderer.registerShape('box', BoxShape);The code registers the BoxShape constructor under the name box in the cell renderer of the graph. The shape can now be referenced using the shape-key in a style definition. (The cell renderer contains a set of additional shapes, namely one for each constant with a SHAPE-prefix in mxConstants.)
Styles are a collection of key, value pairs and a stylesheet is a collection of named styles. The names are referenced by the cellstyle, which is stored in mxCell.style with the following format: [stylename;|key=value;]. The string is resolved to a collection of key, value pairs, where the keys are overridden with the values in the string.
When introducing a new shape, the name under which the shape is registered must be used in the stylesheet. There are three ways of doing this:
In the first case, the code to fetch and modify the default style for vertices is as follows:
var style = graph.getStylesheet().getDefaultVertexStyle(); style[mxConstants.STYLE_SHAPE] = 'box';
The code takes the default vertex style, which is used for all vertices that do not have a specific cellstyle, and modifies the value for the shape-key in-place to use the new BoxShape for drawing vertices. This is done by assigning the box value in the second line, which refers to the name of the BoxShape in the cell renderer.
In the second case, a collection of key, value pairs is created and then added to the stylesheet under a new name. In order to distinguish the shapename and the stylename we’ll use boxstyle for the stylename:
var style = new Object();
style[mxConstants.STYLE_SHAPE] = 'box';
style[mxConstants.STYLE_STROKECOLOR] = '#000000';
style[mxConstants.STYLE_FONTCOLOR] = '#000000';
graph.getStylesheet().putCellStyle('boxstyle', style);The code adds a new style with the name boxstyle to the stylesheet. To use this style with a cell, it must be referenced from the cellstyle as follows:
var vertex = graph.insertVertex(parent, null, 'Hello, World!', 20, 20, 80, 20,
'boxstyle');To summarize, each new shape must be registered in the mxCellRenderer with a unique name. That name is then used as the value of the shape-key in a default or custom style. If there are multiple custom shapes, then there should be a separate style for each shape.
For fill-, stroke-, gradient- and indicatorColors special keywords can be used. The inherit keyword for one of these colors will inherit the color for the same key from the parent cell. The swimlane keyword does the same, but inherits from the nearest swimlane in the ancestor hierarchy. Finally, the indicated keyword will use the color of the indicator as the color for the given key.
The <containers> overflow CSS property defines if scrollbars are used to display the graph. For values of ‘auto’ or ‘scroll’, the scrollbars will be shown. Note that the resizeContainer flag is normally not used together with scrollbars, as it will resize the container to match the size of the graph after each change.
To control the possible connections in mxGraph, getEdgeValidationError is used. The default implementation of the function uses multiplicities, which is an array of mxMultiplicity. Using this class allows to establish simple multiplicities, which are enforced by the graph.
The mxMultiplicity uses <mxCell.is> to determine for which terminals it applies. The default implementation of <mxCell.is> works with DOM nodes (XML nodes) and checks if the given type parameter matches the nodeName of the node (case insensitive). Optionally, an attributename and value can be specified which are also checked.
getEdgeValidationError is called whenever the connectivity of an edge changes. It returns an empty string or an error message if the edge is invalid or null if the edge is valid. If the returned string is not empty then it is displayed as an error message.
mxMultiplicity allows to specify the multiplicity between a terminal and its possible neighbors. For example, if any rectangle may only be connected to, say, a maximum of two circles you can add the following rule to multiplicities:
graph.multiplicities.push(new mxMultiplicity( true, 'rectangle', null, null, 0, 2, ['circle'], 'Only 2 targets allowed', 'Only shape targets allowed'));
This will display the first error message whenever a rectangle is connected to more than two circles and the second error message if a rectangle is connected to anything but a circle.
For certain multiplicities, such as a minimum of 1 connection, which cannot be enforced at cell creation time (unless the cell is created together with the connection), mxGraph offers validate which checks all multiplicities for all cells and displays the respective error messages in an overlay icon on the cells.
If a cell is collapsed and contains validation errors, a respective warning icon is attached to the collapsed cell.
For automatic layout, the <getLayout> hook is provided in mxLayoutManager. It can be overridden to return a layout algorithm for the children of a given cell.
The default values for all switches are designed to meet the requirements of general diagram drawing applications. A very typical set of settings to avoid edges that are not connected is the following:
graph.setAllowDanglingEdges(false); graph.setDisconnectOnMove(false);
Setting the cloneInvalidEdges switch to true is optional. This switch controls if edges are inserted after a copy, paste or clone-drag if they are invalid. For example, edges are invalid if copied or control-dragged without having selected the corresponding terminals and allowDanglingEdges is false, in which case the edges will not be cloned if the switch is false.
To produce an XML representation for a diagram, the following code can be used.
var enc = new mxCodec(mxUtils.createXmlDocument()); var node = enc.encode(graph.getModel());
This will produce an XML node than can be handled using the DOM API or turned into a string representation using the following code:
var xml = mxUtils.getXml(node);
To obtain a formatted string, mxUtils.getPrettyXml can be used instead.
This string can now be stored in a local persistent storage (for example using Google Gears) or it can be passed to a backend using mxUtils.post as follows. The url variable is the URL of the Java servlet, PHP page or HTTP handler, depending on the server.
var xmlString = encodeURIComponent(mxUtils.getXml(node));
mxUtils.post(url, 'xml='+xmlString, function(req)
{
// Process server response using req of type mxXmlRequest
});To load an XML representation of a diagram into an existing graph object mxUtils.load can be used as follows. The url variable is the URL of the Java servlet, PHP page or HTTP handler that produces the XML string.
var xmlDoc = mxUtils.load(url).getXml(); var node = xmlDoc.documentElement; var dec = new mxCodec(node.ownerDocument); dec.decode(node, graph.getModel());
For creating a page that loads the client and a diagram using a single request please refer to the deployment examples in the backends.
(see images/callgraph.png)
| resources/graph | Language resources for mxGraph |
| Events | |
| mxEvent.ROOT | Fires if the root in the model has changed. |
| mxEvent. | Fires between begin- and endUpdate in alignCells. |
| mxEvent. | Fires between begin- and endUpdate in flipEdge. |
| mxEvent. | Fires between begin- and endUpdate in orderCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsOrdered. |
| mxEvent. | Fires between begin- and endUpdate in groupCells. |
| mxEvent. | Fires between begin- and endUpdate in ungroupCells. |
| mxEvent. | Fires between begin- and endUpdate in removeCellsFromParent. |
| mxEvent. | Fires between begin- and endUpdate in addCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsAdded. |
| mxEvent. | Fires between begin- and endUpdate in removeCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsRemoved. |
| mxEvent. | Fires between begin- and endUpdate in splitEdge. |
| mxEvent. | Fires between begin- and endUpdate in toggleCells. |
| mxEvent. | Fires between begin- and endUpdate in foldCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsFolded. |
| mxEvent. | Fires between begin- and endUpdate in updateCellSize. |
| mxEvent. | Fires between begin- and endUpdate in resizeCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsResized. |
| mxEvent. | Fires between begin- and endUpdate in moveCells. |
| mxEvent. | Fires between begin- and endUpdate in cellsMoved. |
| mxEvent. | Fires between begin- and endUpdate in connectCell. |
| mxEvent. | Fires between begin- and endUpdate in cellConnected. |
| mxEvent. | Fires after refresh was executed. |
| mxEvent. | Fires in click after a click event. |
| mxEvent. | Fires in dblClick after a double click. |
| mxEvent. | Fires in fireGestureEvent after a touch gesture. |
| mxEvent. | Fires in tapAndHold if a tap and hold event was detected. |
| mxEvent. | Fires in fireMouseEvent before the mouse listeners are invoked. |
| mxEvent.SIZE | Fires after sizeDidChange was executed. |
| mxEvent. | Fires before the in-place editor starts in startEditingAtCell. |
| mxEvent. | Fires after the in-place editor starts in startEditingAtCell. |
| mxEvent. | Fires after the in-place editor stops in stopEditing. |
| mxEvent. | Fires between begin- and endUpdate in cellLabelChanged. |
| mxEvent. | Fires after an overlay is added in addCellOverlay. |
| mxEvent. | Fires after an overlay is removed in removeCellOverlay and removeCellOverlays. |
| mxGraph | Constructs a new mxGraph in the specified container. |
| Variables | |
| mouseListeners | Holds the mouse event listeners. |
| isMouseDown | Holds the state of the mouse button. |
| model | Holds the mxGraphModel that contains the cells to be displayed. |
| view | Holds the mxGraphView that caches the mxCellStates for the cells. |
| stylesheet | Holds the mxStylesheet that defines the appearance of the cells. |
| selectionModel | Holds the mxGraphSelectionModel that models the current selection. |
| cellEditor | Holds the mxCellEditor that is used as the in-place editing. |
| cellRenderer | Holds the mxCellRenderer for rendering the cells in the graph. |
| multiplicities | An array of mxMultiplicities describing the allowed connections in a graph. |
| renderHint | RenderHint as it was passed to the constructor. |
| dialect | Dialect to be used for drawing the graph. |
| gridSize | Specifies the grid size. |
| gridEnabled | Specifies if the grid is enabled. |
| portsEnabled | Specifies if ports are enabled. |
| nativeDoubleClickEnabled | Specifies if native double click events should be detected. |
| doubleTapEnabled | Specifies if double taps on touch-based devices should be handled as a double click. |
| doubleTapTimeout | Specifies the timeout for double taps and non-native double clicks. |
| doubleTapTolerance | Specifies the tolerance for double taps and double clicks in quirks mode. |
| lastTouchX | Holds the x-coordinate of the last touch event for double tap detection. |
| lastTouchX | Holds the y-coordinate of the last touch event for double tap detection. |
| lastTouchTime | Holds the time of the last touch event for double click detection. |
| tapAndHoldEnabled | Specifies if tap and hold should be used for starting connections on touch-based devices. |
| tapAndHoldDelay | Specifies the time for a tap and hold. |
| tapAndHoldInProgress | True if the timer for tap and hold events is running. |
| tapAndHoldValid | True as long as the timer is running and the touch events stay within the given <tapAndHoldTolerance>. |
| initialTouchX | Holds the x-coordinate of the intial touch event for tap and hold. |
| initialTouchY | Holds the y-coordinate of the intial touch event for tap and hold. |
| tolerance | Tolerance for a move to be handled as a single click. |
| defaultOverlap | Value returned by getOverlap if isAllowOverlapParent returns true for the given cell. |
| defaultParent | Specifies the default parent to be used to insert new cells. |
| alternateEdgeStyle | Specifies the alternate edge style to be used if the main control point on an edge is being doubleclicked. |
| backgroundImage | Specifies the mxImage to be returned by getBackgroundImage. |
| pageVisible | Specifies if the background page should be visible. |
| pageBreaksVisible | Specifies if a dashed line should be drawn between multiple pages. |
| pageBreakColor | Specifies the color for page breaks. |
| pageBreakDashed | Specifies the page breaks should be dashed. |
| minPageBreakDist | Specifies the minimum distance for page breaks to be visible. |
| preferPageSize | Specifies if the graph size should be rounded to the next page number in sizeDidChange. |
| pageFormat | Specifies the page format for the background page. |
| pageScale | Specifies the scale of the background page. |
| enabled | Specifies the return value for isEnabled. |
| escapeEnabled | Specifies if mxKeyHandler should invoke escape when the escape key is pressed. |
| invokesStopCellEditing | If true, when editing is to be stopped by way of selection changing, data in diagram changing or other means stopCellEditing is invoked, and changes are saved. |
| enterStopsCellEditing | If true, pressing the enter key without pressing control or shift will stop editing and accept the new value. |
| useScrollbarsForPanning | Specifies if scrollbars should be used for panning in panGraph if any scrollbars are available. |
| exportEnabled | Specifies the return value for canExportCell. |
| importEnabled | Specifies the return value for canImportCell. |
| cellsLocked | Specifies the return value for isCellLocked. |
| cellsCloneable | Specifies the return value for isCellCloneable. |
| foldingEnabled | Specifies if folding (collapse and expand via an image icon in the graph should be enabled). |
| cellsEditable | Specifies the return value for isCellEditable. |
| cellsDeletable | Specifies the return value for isCellDeletable. |
| cellsMovable | Specifies the return value for isCellMovable. |
| edgeLabelsMovable | Specifies the return value for edges in isLabelMovable. |
| vertexLabelsMovable | Specifies the return value for vertices in isLabelMovable. |
| dropEnabled | Specifies the return value for isDropEnabled. |
| splitEnabled | Specifies if dropping onto edges should be enabled. |
| cellsResizable | Specifies the return value for isCellResizable. |
| cellsBendable | Specifies the return value for isCellsBendable. |
| cellsSelectable | Specifies the return value for isCellSelectable. |
| cellsDisconnectable | Specifies the return value for <isCellDisconntable>. |
| autoSizeCells | Specifies if the graph should automatically update the cell size after an edit. |
| autoSizeCellsOnAdd | Specifies if autoSize style should be applied when cells are added. |
| autoScroll | Specifies if the graph should automatically scroll if the mouse goes near the container edge while dragging. |
| ignoreScrollbars | Specifies if the graph should automatically scroll regardless of the scrollbars. |
| translateToScrollPosition | Specifies if the graph should automatically convert the current scroll position to a translate in the graph view when a mouseUp event is received. |
| timerAutoScroll | Specifies if autoscrolling should be carried out via mxPanningManager even if the container has scrollbars. |
| allowAutoPanning | Specifies if panning via panGraph should be allowed to implement autoscroll if no scrollbars are available in scrollPointToVisible. |
| autoExtend | Specifies if the size of the graph should be automatically extended if the mouse goes near the container edge while dragging. |
| maximumGraphBounds | mxRectangle that specifies the area in which all cells in the diagram should be placed. |
| minimumGraphSize | mxRectangle that specifies the minimum size of the graph. |
| minimumContainerSize | mxRectangle that specifies the minimum size of the <container> if resizeContainer is true. |
| maximumContainerSize | mxRectangle that specifies the maximum size of the container if resizeContainer is true. |
| resizeContainer | Specifies if the container should be resized to the graph size when the graph size has changed. |
| border | Border to be added to the bottom and right side when the container is being resized after the graph has been changed. |
| keepEdgesInForeground | Specifies if edges should appear in the foreground regardless of their order in the model. |
| keepEdgesInBackground | Specifies if edges should appear in the background regardless of their order in the model. |
| allowNegativeCoordinates | Specifies if negative coordinates for vertices are allowed. |
| constrainChildren | Specifies if a child should be constrained inside the parent bounds after a move or resize of the child. |
| constrainRelativeChildren | Specifies if child cells with relative geometries should be constrained inside the parent bounds, if constrainChildren is true, and/or the maximumGraphBounds. |
| extendParents | Specifies if a parent should contain the child bounds after a resize of the child. |
| extendParentsOnAdd | Specifies if parents should be extended according to the extendParents switch if cells are added. |
| extendParentsOnAdd | Specifies if parents should be extended according to the extendParents switch if cells are added. |
| recursiveResize | Specifies the return value for isRecursiveResize. |
| collapseToPreferredSize | Specifies if the cell size should be changed to the preferred size when a cell is first collapsed. |
| zoomFactor | Specifies the factor used for zoomIn and zoomOut. |
| keepSelectionVisibleOnZoom | Specifies if the viewport should automatically contain the selection cells after a zoom operation. |
| centerZoom | Specifies if the zoom operations should go into the center of the actual diagram rather than going from top, left. |
| resetViewOnRootChange | Specifies if the scale and translate should be reset if the root changes in the model. |
| resetEdgesOnResize | Specifies if edge control points should be reset after the resize of a connected cell. |
| resetEdgesOnMove | Specifies if edge control points should be reset after the move of a connected cell. |
| resetEdgesOnConnect | Specifies if edge control points should be reset after the the edge has been reconnected. |
| allowLoops | Specifies if loops (aka self-references) are allowed. |
| defaultLoopStyle | mxEdgeStyle to be used for loops. |
| multigraph | Specifies if multiple edges in the same direction between the same pair of vertices are allowed. |
| connectableEdges | Specifies if edges are connectable. |
| allowDanglingEdges | Specifies if edges with disconnected terminals are allowed in the graph. |
| cloneInvalidEdges | Specifies if edges that are cloned should be validated and only inserted if they are valid. |
| disconnectOnMove | Specifies if edges should be disconnected from their terminals when they are moved. |
| labelsVisible | Specifies if labels should be visible. |
| htmlLabels | Specifies the return value for isHtmlLabel. |
| swimlaneSelectionEnabled | Specifies if swimlanes should be selectable via the content if the mouse is released. |
| swimlaneNesting | Specifies if nesting of swimlanes is allowed. |
| swimlaneIndicatorColorAttribute | The attribute used to find the color for the indicator if the indicator color is set to ‘swimlane’. |
| imageBundles | Holds the list of image bundles. |
| minFitScale | Specifies the minimum scale to be applied in fit. |
| maxFitScale | Specifies the maximum scale to be applied in fit. |
| panDx | Current horizontal panning value. |
| panDy | Current vertical panning value. |
| collapsedImage | Specifies the mxImage to indicate a collapsed state. |
| expandedImage | Specifies the mxImage to indicate a expanded state. |
| warningImage | Specifies the mxImage for the image to be used to display a warning overlay. |
| alreadyConnectedResource | Specifies the resource key for the error message to be displayed in non-multigraphs when two vertices are already connected. |
| containsValidationErrorsResource | Specifies the resource key for the warning message to be displayed when a collapsed cell contains validation errors. |
| collapseExpandResource | Specifies the resource key for the tooltip on the collapse/expand icon. |
| init | Initializes the <container> and creates the respective datastructures. |
| createHandlers | Creates the tooltip-, panning-, connection- and graph-handler (in this order). |
| createTooltipHandler | Creates and returns a new mxTooltipHandler to be used in this graph. |
| createSelectionCellsHandler | Creates and returns a new mxTooltipHandler to be used in this graph. |
| createConnectionHandler | Creates and returns a new mxConnectionHandler to be used in this graph. |
| createGraphHandler | Creates and returns a new mxGraphHandler to be used in this graph. |
| createPanningHandler | Creates and returns a new mxPanningHandler to be used in this graph. |
| createPopupMenuHandler | Creates and returns a new mxPopupMenuHandler to be used in this graph. |
| createSelectionModel | Creates a new mxGraphSelectionModel to be used in this graph. |
| createStylesheet | Creates a new mxGraphSelectionModel to be used in this graph. |
| createGraphView | Creates a new mxGraphView to be used in this graph. |
| createCellRenderer | Creates a new mxCellRenderer to be used in this graph. |
| createCellEditor | Creates a new mxCellEditor to be used in this graph. |
| getModel | Returns the mxGraphModel that contains the cells. |
| getView | Returns the mxGraphView that contains the mxCellStates. |
| getStylesheet | Returns the mxStylesheet that defines the style. |
| setStylesheet | Sets the mxStylesheet that defines the style. |
| getSelectionModel | Returns the mxGraphSelectionModel that contains the selection. |
| setSelectionModel | Sets the <mxSelectionModel> that contains the selection. |
| getSelectionCellsForChanges | Returns the cells to be selected for the given array of changes. |
| graphModelChanged | Called when the graph model changes. |
| updateSelection | Removes selection cells that are not in the model from the selection. |
| processChange | Processes the given change and invalidates the respective cached data in view. |
| removeStateForCell | Removes all cached information for the given cell and its descendants. |
| Overlays | |
| addCellOverlay | Adds an mxCellOverlay for the specified cell. |
| getCellOverlays | Returns the array of mxCellOverlays for the given cell or null, if no overlays are defined. |
| removeCellOverlay | Removes and returns the given mxCellOverlay from the given cell. |
| removeCellOverlays | Removes all mxCellOverlays from the given cell. |
| clearCellOverlays | Removes all mxCellOverlays in the graph for the given cell and all its descendants. |
| setCellWarning | Creates an overlay for the given cell using the warning and image or warningImage and returns the new mxCellOverlay. |
| In-place editing | |
| startEditing | Calls startEditingAtCell using the given cell or the first selection cell. |
| startEditingAtCell | Fires a startEditing event and invokes mxCellEditor.startEditing on <editor>. |
| getEditingValue | Returns the initial value for in-place editing. |
| stopEditing | Stops the current editing and fires a <editingStopped> event. |
| labelChanged | Sets the label of the specified cell to the given value using cellLabelChanged and fires mxEvent.LABEL_CHANGED while the transaction is in progress. |
| cellLabelChanged | Sets the new label for a cell. |
| Event processing | |
| escape | Processes an escape keystroke. |
| click | Processes a singleclick on an optional cell and fires a click event. |
| dblClick | Processes a doubleclick on an optional cell and fires a <dblclick> event. |
| tapAndHold | Handles the mxMouseEvent by highlighting the mxCellState. |
| scrollPointToVisible | Scrolls the graph to the given point, extending the graph container if specified. |
| createPanningManager | Creates and returns an mxPanningManager. |
| getBorderSizes | Returns the size of the border and padding on all four sides of the container. |
| getPreferredPageSize | Returns the preferred size of the background page if preferPageSize is true. |
| fit | Scales the graph such that the complete diagram fits into <container> and returns the current scale in the view. |
| sizeDidChange | Called when the size of the graph has changed. |
| doResizeContainer | Resizes the container for the given graph width and height. |
| updatePageBreaks | Invokes from sizeDidChange to redraw the page breaks. |
| Cell styles | |
| getCellStyle | Returns an array of key, value pairs representing the cell style for the given cell. |
| postProcessCellStyle | Tries to resolve the value for the image style in the image bundles and turns short data URIs as defined in mxImageBundle to data URIs as defined in RFC 2397 of the IETF. |
| setCellStyle | Sets the style of the specified cells. |
| toggleCellStyle | Toggles the boolean value for the given key in the style of the given cell and returns the new value as 0 or 1. |
| toggleCellStyles | Toggles the boolean value for the given key in the style of the given cells and returns the new value as 0 or 1. |
| setCellStyles | Sets the key to value in the styles of the given cells. |
| toggleCellStyleFlags | Toggles the given bit for the given key in the styles of the specified cells. |
| setCellStyleFlags | Sets or toggles the given bit for the given key in the styles of the specified cells. |
| Cell alignment and orientation | |
| alignCells | Aligns the given cells vertically or horizontally according to the given alignment using the optional parameter as the coordinate. |
| flipEdge | Toggles the style of the given edge between null (or empty) and alternateEdgeStyle. |
| addImageBundle | Adds the specified mxImageBundle. |
| removeImageBundle | Removes the specified mxImageBundle. |
| getImageFromBundles | Searches all imageBundles for the specified key and returns the value for the first match or null if the key is not found. |
| Order | |
| orderCells | Moves the given cells to the front or back. |
| cellsOrdered | Moves the given cells to the front or back. |
| Grouping | |
| groupCells | Adds the cells into the given group. |
| getCellsForGroup | Returns the cells with the same parent as the first cell in the given array. |
| getBoundsForGroup | Returns the bounds to be used for the given group and children. |
| createGroupCell | Hook for creating the group cell to hold the given array of mxCells if no group cell was given to the <group> function. |
| ungroupCells | Ungroups the given cells by moving the children the children to their parents parent and removing the empty groups. |
| removeCellsAfterUngroup | Hook to remove the groups after ungroupCells. |
| removeCellsFromParent | Removes the specified cells from their parents and adds them to the default parent. |
| updateGroupBounds | Updates the bounds of the given groups to include all children and returns the passed-in cells. |
| getBoundingBox | Returns the bounding box for the given array of mxCells. |
| Cell cloning, insertion and removal | |
| cloneCell | Returns the clone for the given cell. |
| cloneCells | Returns the clones for the given cells. |
| insertVertex | Adds a new vertex into the given parent mxCell using value as the user object and the given coordinates as the mxGeometry of the new vertex. |
| createVertex | Hook method that creates the new vertex for insertVertex. |
| insertEdge | Adds a new edge into the given parent mxCell using value as the user object and the given source and target as the terminals of the new edge. |
| createEdge | Hook method that creates the new edge for insertEdge. |
| addEdge | Adds the edge to the parent and connects it to the given source and target terminals. |
| addCell | Adds the cell to the parent and connects it to the given source and target terminals. |
| addCells | Adds the cells to the parent at the given index, connecting each cell to the optional source and target terminal. |
| cellsAdded | Adds the specified cells to the given parent. |
| autoSizeCell | Resizes the specified cell to just fit around the its label and/or children |
| removeCells | Removes the given cells from the graph including all connected edges if includeEdges is true. |
| cellsRemoved | Removes the given cells from the model. |
| splitEdge | Splits the given edge by adding the newEdge between the previous source and the given cell and reconnecting the source of the given edge to the given cell. |
| Cell visibility | |
| toggleCells | Sets the visible state of the specified cells and all connected edges if includeEdges is true. |
| cellsToggled | Sets the visible state of the specified cells. |
| Folding | |
| foldCells | Sets the collapsed state of the specified cells and all descendants if recurse is true. |
| cellsFolded | Sets the collapsed state of the specified cells. |
| swapBounds | Swaps the alternate and the actual bounds in the geometry of the given cell invoking updateAlternateBounds before carrying out the swap. |
| updateAlternateBounds | Updates or sets the alternate bounds in the given geometry for the given cell depending on whether the cell is going to be collapsed. |
| addAllEdges | Returns an array with the given cells and all edges that are connected to a cell or one of its descendants. |
| getAllEdges | Returns all edges connected to the given cells or its descendants. |
| Cell sizing | |
| updateCellSize | Updates the size of the given cell in the model using cellSizeUpdated. |
| cellSizeUpdated | Updates the size of the given cell in the model using getPreferredSizeForCell to get the new size. |
| getPreferredSizeForCell | Returns the preferred width and height of the given mxCell as an mxRectangle. |
| resizeCell | Sets the bounds of the given cell using resizeCells. |
| resizeCells | Sets the bounds of the given cells and fires a mxEvent.RESIZE_CELLS event while the transaction is in progress. |
| cellsResized | Sets the bounds of the given cells and fires a mxEvent.CELLS_RESIZED event. |
| cellResized | Resizes the parents recursively so that they contain the complete area of the resized child cell. |
| resizeChildCells | Resizes the child cells of the given cell for the given new geometry with respect to the current geometry of the cell. |
| constrainChildCells | Constrains the children of the given cell using constrainChild. |
| scaleCell | Scales the points, position and size of the given cell according to the given vertical and horizontal scaling factors. |
| extendParent | Resizes the parents recursively so that they contain the complete area of the resized child cell. |
| Cell moving | |
| importCells | Clones and inserts the given cells into the graph using the move method and returns the inserted cells. |
| moveCells | Moves or clones the specified cells and moves the cells or clones by the given amount, adding them to the optional target cell. |
| cellsMoved | Moves the specified cells by the given vector, disconnecting the cells using disconnectGraph is disconnect is true. |
| translateCell | Translates the geometry of the given cell and stores the new, translated geometry in the model as an atomic change. |
| getCellContainmentArea | Returns the mxRectangle inside which a cell is to be kept. |
| getMaximumGraphBounds | Returns the bounds inside which the diagram should be kept as an mxRectangle. |
| constrainChild | Keeps the given cell inside the bounds returned by getCellContainmentArea for its parent, according to the rules defined by getOverlap and isConstrainChild. |
| resetEdges | Resets the control points of the edges that are connected to the given cells if not both ends of the edge are in the given cells array. |
| resetEdge | Resets the control points of the given edge. |
| Cell connecting and connection constraints | |
| getOutlineConstraint | Returns the constraint used to connect to the outline of the given state. |
| getAllConnectionConstraints | Returns an array of all mxConnectionConstraints for the given terminal. |
| getConnectionConstraint | Returns an mxConnectionConstraint that describes the given connection point. |
| setConnectionConstraint | Sets the mxConnectionConstraint that describes the given connection point. |
| getConnectionPoint | Returns the nearest point in the list of absolute points or the center of the opposite terminal. |
| connectCell | Connects the specified end of the given edge to the given terminal using cellConnected and fires mxEvent.CONNECT_CELL while the transaction is in progress. |
| cellConnected | Sets the new terminal for the given edge and resets the edge points if resetEdgesOnConnect is true. |
| disconnectGraph | Disconnects the given edges from the terminals which are not in the given array. |
| Drilldown | |
| getCurrentRoot | Returns the current root of the displayed cell hierarchy. |
| getTranslateForRoot | Returns the translation to be used if the given cell is the root cell as an mxPoint. |
| isPort | Returns true if the given cell is a “port”, that is, when connecting to it, the cell returned by getTerminalForPort should be used as the terminal and the port should be referenced by the ID in either the mxConstants.STYLE_SOURCE_PORT or the or the mxConstants.STYLE_TARGET_PORT. |
| getTerminalForPort | Returns the terminal to be used for a given port. |
| getChildOffsetForCell | Returns the offset to be used for the cells inside the given cell. |
| enterGroup | Uses the given cell as the root of the displayed cell hierarchy. |
| exitGroup | Changes the current root to the next valid root in the displayed cell hierarchy. |
| home | Uses the root of the model as the root of the displayed cell hierarchy and selects the previous root. |
| isValidRoot | Returns true if the given cell is a valid root for the cell display hierarchy. |
| Graph display | |
| getGraphBounds | Returns the bounds of the visible graph. |
| getCellBounds | Returns the scaled, translated bounds for the given cell. |
| getBoundingBoxFromGeometry | Returns the bounding box for the geometries of the vertices in the given array of cells. |
| refresh | Clears all cell states or the states for the hierarchy starting at the given cell and validates the graph. |
| snap | Snaps the given numeric value to the grid if gridEnabled is true. |
| panGraph | Shifts the graph display by the given amount. |
| zoomIn | Zooms into the graph by zoomFactor. |
| zoomOut | Zooms out of the graph by zoomFactor. |
| zoomActual | Resets the zoom and panning in the view. |
| zoomTo | Zooms the graph to the given scale with an optional boolean center argument, which is passd to zoom. |
| center | Centers the graph in the container. |
| zoom | Zooms the graph using the given factor. |
| zoomToRect | Zooms the graph to the specified rectangle. |
| scrollCellToVisible | Pans the graph so that it shows the given cell. |
| scrollRectToVisible | Pans the graph so that it shows the given rectangle. |
| getCellGeometry | Returns the mxGeometry for the given cell. |
| isCellVisible | Returns true if the given cell is visible in this graph. |
| isCellCollapsed | Returns true if the given cell is collapsed in this graph. |
| isCellConnectable | Returns true if the given cell is connectable in this graph. |
| isOrthogonal | Returns true if perimeter points should be computed such that the resulting edge has only horizontal or vertical segments. |
| isLoop | Returns true if the given cell state is a loop. |
| isCloneEvent | Returns true if the given event is a clone event. |
| isTransparentClickEvent | Hook for implementing click-through behaviour on selected cells. |
| isToggleEvent | Returns true if the given event is a toggle event. |
| isGridEnabledEvent | Returns true if the given mouse event should be aligned to the grid. |
| isConstrainedEvent | Returns true if the given mouse event should be aligned to the grid. |
| isIgnoreTerminalEvent | Returns true if the given mouse event should not allow any connections to be made. |
| Validation | |
| validationAlert | Displays the given validation error in a dialog. |
| isEdgeValid | Checks if the return value of getEdgeValidationError for the given arguments is null. |
| getEdgeValidationError | Returns the validation error message to be displayed when inserting or changing an edges’ connectivity. |
| validateEdge | Hook method for subclassers to return an error message for the given edge and terminals. |
| validateGraph | Validates the graph by validating each descendant of the given cell or the root of the model. |
| getCellValidationError | Checks all multiplicities that cannot be enforced while the graph is being modified, namely, all multiplicities that require a minimum of 1 edge. |
| validateCell | Hook method for subclassers to return an error message for the given cell and validation context. |
| Graph appearance | |
| getBackgroundImage | Returns the backgroundImage as an mxImage. |
| setBackgroundImage | Sets the new backgroundImage. |
| getFoldingImage | Returns the mxImage used to display the collapsed state of the specified cell state. |
| convertValueToString | Returns the textual representation for the given cell. |
| getLabel | Returns a string or DOM node that represents the label for the given cell. |
| isHtmlLabel | Returns true if the label must be rendered as HTML markup. |
| isHtmlLabels | Returns htmlLabels. |
| setHtmlLabels | Sets htmlLabels. |
| isWrapping | This enables wrapping for HTML labels. |
| isLabelClipped | Returns true if the overflow portion of labels should be hidden. |
| getTooltip | Returns the string or DOM node that represents the tooltip for the given state, node and coordinate pair. |
| getTooltipForCell | Returns the string or DOM node to be used as the tooltip for the given cell. |
| getLinkForCell | Returns the string to be used as the link for the given cell. |
| getCursorForMouseEvent | Returns the cursor value to be used for the CSS of the shape for the given event. |
| getCursorForCell | Returns the cursor value to be used for the CSS of the shape for the given cell. |
| getStartSize | Returns the start size of the given swimlane, that is, the width or height of the part that contains the title, depending on the horizontal style. |
| getImage | Returns the image URL for the given cell state. |
| getVerticalAlign | Returns the vertical alignment for the given cell state. |
| getIndicatorColor | Returns the indicator color for the given cell state. |
| getIndicatorGradientColor | Returns the indicator gradient color for the given cell state. |
| getIndicatorShape | Returns the indicator shape for the given cell state. |
| getIndicatorImage | Returns the indicator image for the given cell state. |
| getBorder | Returns the value of border. |
| setBorder | Sets the value of border. |
| isSwimlane | Returns true if the given cell is a swimlane in the graph. |
| Graph behaviour | |
| isResizeContainer | Returns resizeContainer. |
| setResizeContainer | Sets resizeContainer. |
| isEnabled | Returns true if the graph is enabled. |
| setEnabled | Specifies if the graph should allow any interactions. |
| isEscapeEnabled | Returns escapeEnabled. |
| setEscapeEnabled | Sets escapeEnabled. |
| isInvokesStopCellEditing | Returns invokesStopCellEditing. |
| setInvokesStopCellEditing | Sets invokesStopCellEditing. |
| isEnterStopsCellEditing | Returns enterStopsCellEditing. |
| setEnterStopsCellEditing | Sets enterStopsCellEditing. |
| isCellLocked | Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected. |
| isCellsLocked | Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected. |
| setCellsLocked | Sets if any cell may be moved, sized, bended, disconnected, edited or selected. |
| getCloneableCells | Returns the cells which may be exported in the given array of cells. |
| isCellCloneable | Returns true if the given cell is cloneable. |
| isCellsCloneable | Returns cellsCloneable, that is, if the graph allows cloning of cells by using control-drag. |
| setCellsCloneable | Specifies if the graph should allow cloning of cells by holding down the control key while cells are being moved. |
| getExportableCells | Returns the cells which may be exported in the given array of cells. |
| canExportCell | Returns true if the given cell may be exported to the clipboard. |
| getImportableCells | Returns the cells which may be imported in the given array of cells. |
| canImportCell | Returns true if the given cell may be imported from the clipboard. |
| isCellSelectable | Returns true if the given cell is selectable. |
| isCellsSelectable | Returns cellsSelectable. |
| setCellsSelectable | Sets cellsSelectable. |
| getDeletableCells | Returns the cells which may be exported in the given array of cells. |
| isCellDeletable | Returns true if the given cell is moveable. |
| isCellsDeletable | Returns cellsDeletable. |
| setCellsDeletable | Sets cellsDeletable. |
| isLabelMovable | Returns true if the given edges’s label is moveable. |
| isCellRotatable | Returns true if the given cell is rotatable. |
| getMovableCells | Returns the cells which are movable in the given array of cells. |
| isCellMovable | Returns true if the given cell is moveable. |
| isCellsMovable | Returns cellsMovable. |
| setCellsMovable | Specifies if the graph should allow moving of cells. |
| isGridEnabled | Returns gridEnabled as a boolean. |
| setGridEnabled | Specifies if the grid should be enabled. |
| isPortsEnabled | Returns portsEnabled as a boolean. |
| setPortsEnabled | Specifies if the ports should be enabled. |
| getGridSize | Returns gridSize. |
| setGridSize | Sets gridSize. |
| getTolerance | Returns tolerance. |
| setTolerance | Sets tolerance. |
| isVertexLabelsMovable | Returns vertexLabelsMovable. |
| setVertexLabelsMovable | Sets vertexLabelsMovable. |
| isEdgeLabelsMovable | Returns edgeLabelsMovable. |
| isEdgeLabelsMovable | Sets edgeLabelsMovable. |
| isSwimlaneNesting | Returns swimlaneNesting as a boolean. |
| setSwimlaneNesting | Specifies if swimlanes can be nested by drag and drop. |
| isSwimlaneSelectionEnabled | Returns swimlaneSelectionEnabled as a boolean. |
| setSwimlaneSelectionEnabled | Specifies if swimlanes should be selected if the mouse is released over their content area. |
| isMultigraph | Returns multigraph as a boolean. |
| setMultigraph | Specifies if the graph should allow multiple connections between the same pair of vertices. |
| isAllowLoops | Returns allowLoops as a boolean. |
| setAllowDanglingEdges | Specifies if dangling edges are allowed, that is, if edges are allowed that do not have a source and/or target terminal defined. |
| isAllowDanglingEdges | Returns allowDanglingEdges as a boolean. |
| setConnectableEdges | Specifies if edges should be connectable. |
| isConnectableEdges | Returns connectableEdges as a boolean. |
| setCloneInvalidEdges | Specifies if edges should be inserted when cloned but not valid wrt. |
| isCloneInvalidEdges | Returns cloneInvalidEdges as a boolean. |
| setAllowLoops | Specifies if loops are allowed. |
| isDisconnectOnMove | Returns disconnectOnMove as a boolean. |
| setDisconnectOnMove | Specifies if edges should be disconnected when moved. |
| isDropEnabled | Returns dropEnabled as a boolean. |
| setDropEnabled | Specifies if the graph should allow dropping of cells onto or into other cells. |
| isSplitEnabled | Returns splitEnabled as a boolean. |
| setSplitEnabled | Specifies if the graph should allow dropping of cells onto or into other cells. |
| isCellResizable | Returns true if the given cell is resizable. |
| isCellsResizable | Returns cellsResizable. |
| setCellsResizable | Specifies if the graph should allow resizing of cells. |
| isTerminalPointMovable | Returns true if the given terminal point is movable. |
| isCellBendable | Returns true if the given cell is bendable. |
| isCellsBendable | Returns <cellsBenadable>. |
| setCellsBendable | Specifies if the graph should allow bending of edges. |
| isCellEditable | Returns true if the given cell is editable. |
| isCellsEditable | Returns cellsEditable. |
| setCellsEditable | Specifies if the graph should allow in-place editing for cell labels. |
| isCellDisconnectable | Returns true if the given cell is disconnectable from the source or target terminal. |
| isCellsDisconnectable | Returns cellsDisconnectable. |
| setCellsDisconnectable | Sets cellsDisconnectable. |
| isValidSource | Returns true if the given cell is a valid source for new connections. |
| isValidTarget | Returns isValidSource for the given cell. |
| isValidConnection | Returns true if the given target cell is a valid target for source. |
| setConnectable | Specifies if the graph should allow new connections. |
| isConnectable | Returns true if the <connectionHandler> is enabled. |
| setTooltips | Specifies if tooltips should be enabled. |
| setPanning | Specifies if panning should be enabled. |
| isEditing | Returns true if the given cell is currently being edited. |
| isAutoSizeCell | Returns true if the size of the given cell should automatically be updated after a change of the label. |
| isAutoSizeCells | Returns autoSizeCells. |
| setAutoSizeCells | Specifies if cell sizes should be automatically updated after a label change. |
| isExtendParent | Returns true if the parent of the given cell should be extended if the child has been resized so that it overlaps the parent. |
| isExtendParents | Returns extendParents. |
| setExtendParents | Sets extendParents. |
| isExtendParentsOnAdd | Returns extendParentsOnAdd. |
| setExtendParentsOnAdd | Sets extendParentsOnAdd. |
| isExtendParentsOnMove | Returns <extendParentsOnMove>. |
| setExtendParentsOnMove | Sets <extendParentsOnMove>. |
| isRecursiveResize | Returns recursiveResize. |
| setRecursiveResize | Sets recursiveResize. |
| isConstrainChild | Returns true if the given cell should be kept inside the bounds of its parent according to the rules defined by getOverlap and isAllowOverlapParent. |
| isConstrainChildren | Returns constrainChildren. |
| setConstrainChildren | Sets constrainChildren. |
| isConstrainRelativeChildren | Returns constrainRelativeChildren. |
| setConstrainRelativeChildren | Sets constrainRelativeChildren. |
| isConstrainChildren | Returns allowNegativeCoordinates. |
| setConstrainChildren | Sets allowNegativeCoordinates. |
| getOverlap | Returns a decimal number representing the amount of the width and height of the given cell that is allowed to overlap its parent. |
| isAllowOverlapParent | Returns true if the given cell is allowed to be placed outside of the parents area. |
| getFoldableCells | Returns the cells which are movable in the given array of cells. |
| isCellFoldable | Returns true if the given cell is foldable. |
| isValidDropTarget | Returns true if the given cell is a valid drop target for the specified cells. |
| isSplitTarget | Returns true if the given edge may be splitted into two edges with the given cell as a new terminal between the two. |
| getDropTarget | Returns the given cell if it is a drop target for the given cells or the nearest ancestor that may be used as a drop target for the given cells. |
| Cell retrieval | |
| getDefaultParent | Returns defaultParent or mxGraphView.currentRoot or the first child child of mxGraphModel.root if both are null. |
| setDefaultParent | Sets the defaultParent to the given cell. |
| getSwimlane | Returns the nearest ancestor of the given cell which is a swimlane, or the given cell, if it is itself a swimlane. |
| getSwimlaneAt | Returns the bottom-most swimlane that intersects the given point (x, y) in the cell hierarchy that starts at the given parent. |
| getCellAt | Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy starting at the given parent. |
| intersects | Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy that starts at the given parent. |
| hitsSwimlaneContent | Returns true if the given coordinate pair is inside the content are of the given swimlane. |
| getChildVertices | Returns the visible child vertices of the given parent. |
| getChildEdges | Returns the visible child edges of the given parent. |
| getChildCells | Returns the visible child vertices or edges in the given parent. |
| getConnections | Returns all visible edges connected to the given cell without loops. |
| getIncomingEdges | Returns the visible incoming edges for the given cell. |
| getOutgoingEdges | Returns the visible outgoing edges for the given cell. |
| getEdges | Returns the incoming and/or outgoing edges for the given cell. |
| isValidAncestor | Returns whether or not the specified parent is a valid ancestor of the specified cell, either direct or indirectly based on whether ancestor recursion is enabled. |
| getOpposites | Returns all distinct visible opposite cells for the specified terminal on the given edges. |
| getEdgesBetween | Returns the edges between the given source and target. |
| getPointForEvent | Returns an mxPoint representing the given event in the unscaled, non-translated coordinate space of <container> and applies the grid. |
| getCells | Returns the child vertices and edges of the given parent that are contained in the given rectangle. |
| getCellsBeyond | Returns the children of the given parent that are contained in the halfpane from the given point (x0, y0) rightwards or downwards depending on rightHalfpane and bottomHalfpane. |
| findTreeRoots | Returns all children in the given parent which do not have incoming edges. |
| traverse | Traverses the (directed) graph invoking the given function for each visited vertex and edge. |
| Selection | |
| isCellSelected | Returns true if the given cell is selected. |
| isSelectionEmpty | Returns true if the selection is empty. |
| clearSelection | Clears the selection using mxGraphSelectionModel.clear. |
| getSelectionCount | Returns the number of selected cells. |
| getSelectionCell | Returns the first cell from the array of selected mxCells. |
| getSelectionCells | Returns the array of selected mxCells. |
| setSelectionCell | Sets the selection cell. |
| setSelectionCells | Sets the selection cell. |
| addSelectionCell | Adds the given cell to the selection. |
| addSelectionCells | Adds the given cells to the selection. |
| removeSelectionCell | Removes the given cell from the selection. |
| removeSelectionCells | Removes the given cells from the selection. |
| selectRegion | Selects and returns the cells inside the given rectangle for the specified event. |
| selectNextCell | Selects the next cell. |
| selectPreviousCell | Selects the previous cell. |
| selectParentCell | Selects the parent cell. |
| selectChildCell | Selects the first child cell. |
| selectCell | Selects the next, parent, first child or previous cell, if all arguments are false. |
| selectAll | Selects all children of the given parent cell or the children of the default parent if no parent is specified. |
| selectVertices | Select all vertices inside the given parent or the default parent. |
| selectVertices | Select all vertices inside the given parent or the default parent. |
| selectCells | Selects all vertices and/or edges depending on the given boolean arguments recursively, starting at the given parent or the default parent if no parent is specified. |
| selectCellForEvent | Selects the given cell by either adding it to the selection or replacing the selection depending on whether the given mouse event is a toggle event. |
| selectCellsForEvent | Selects the given cells by either adding them to the selection or replacing the selection depending on whether the given mouse event is a toggle event. |
| Selection state | |
| createHandler | Creates a new handler for the given cell state. |
| createVertexHandler | Hooks to create a new mxVertexHandler for the given mxCellState. |
| createEdgeHandler | Hooks to create a new mxEdgeHandler for the given mxCellState. |
| createEdgeSegmentHandler | Hooks to create a new <mxEdgeSegmentHandler> for the given mxCellState. |
| createElbowEdgeHandler | Hooks to create a new mxElbowEdgeHandler for the given mxCellState. |
| Graph events | |
| addMouseListener | Adds a listener to the graph event dispatch loop. |
| removeMouseListener | Removes the specified graph listener. |
| updateMouseEvent | Sets the graphX and graphY properties if the given mxMouseEvent if required and returned the event. |
| getStateForEvent | Returns the state for the given touch event. |
| isEventIgnored | Returns true if the event should be ignored in fireMouseEvent. |
| isSyntheticEventIgnored | Hook for ignoring synthetic mouse events after touchend in Firefox. |
| isEventSourceIgnored | Returns true if the event should be ignored in fireMouseEvent. |
| getEventState | Returns the mxCellState to be used when firing the mouse event for the given state. |
| fireMouseEvent | Dispatches the given event in the graph event dispatch loop. |
| consumeMouseEvent | Consumes the given mxMouseEvent if it’s a touchStart event. |
| fireGestureEvent | Dispatches a mxEvent.GESTURE event. |
| destroy | Destroys the graph and all its resources. |
Fires between begin- and endUpdate in alignCells. The <code>cells</code> and <code>align</code> properties contain the respective arguments that were passed to alignCells.
Fires between begin- and endUpdate in orderCells. The <code>cells</code> and <code>back</code> properties contain the respective arguments that were passed to orderCells.
Fires between begin- and endUpdate in cellsOrdered. The <code>cells</code> and <code>back</code> arguments contain the respective arguments that were passed to cellsOrdered.
Fires between begin- and endUpdate in groupCells. The <code>group</code>, <code>cells</code> and <code>border</code> arguments contain the respective arguments that were passed to groupCells.
Fires between begin- and endUpdate in ungroupCells. The <code>cells</code> property contains the array of cells that was passed to ungroupCells.
Fires between begin- and endUpdate in removeCellsFromParent. The <code>cells</code> property contains the array of cells that was passed to removeCellsFromParent.
Fires between begin- and endUpdate in cellsAdded. The <code>cells</code>, <code>parent</code>, <code>index</code>, <code>source</code>, <code>target</code> and <code>absolute</code> properties contain the respective arguments that were passed to cellsAdded.
Fires between begin- and endUpdate in removeCells. The <code>cells</code> and <code>includeEdges</code> arguments contain the respective arguments that were passed to removeCells.
Fires between begin- and endUpdate in cellsRemoved. The <code>cells</code> argument contains the array of cells that was removed.
Fires between begin- and endUpdate in toggleCells. The <code>show</code>, <code>cells</code> and <code>includeEdges</code> properties contain the respective arguments that were passed to toggleCells.
Fires between begin- and endUpdate in cellsFolded. The <code>collapse</code>, <code>cells</code> and <code>recurse</code> properties contain the respective arguments that were passed to cellsFolded.
Fires between begin- and endUpdate in updateCellSize. The <code>cell</code> and <code>ignoreChildren</code> properties contain the respective arguments that were passed to updateCellSize.
Fires between begin- and endUpdate in resizeCells. The <code>cells</code> and <code>bounds</code> properties contain the respective arguments that were passed to resizeCells.
Fires between begin- and endUpdate in cellsResized. The <code>cells</code> and <code>bounds</code> properties contain the respective arguments that were passed to cellsResized.
Fires between begin- and endUpdate in cellsMoved. The <code>cells</code>, <code>dx</code>, <code>dy</code> and <code>disconnect</code> properties contain the respective arguments that were passed to cellsMoved.
Fires between begin- and endUpdate in connectCell. The <code>edge</code>, <code>terminal</code> and <code>source</code> properties contain the respective arguments that were passed to connectCell.
Fires between begin- and endUpdate in cellConnected. The <code>edge</code>, <code>terminal</code> and <code>source</code> properties contain the respective arguments that were passed to cellConnected.
Fires after refresh was executed. This event has no properties.
Fires in click after a click event. The <code>event</code> property contains the original mouse event and <code>cell</code> property contains the cell under the mouse or null if the background was clicked.
Fires in dblClick after a double click. The <code>event</code> property contains the original mouse event and the <code>cell</code> property contains the cell under the mouse or null if the background was clicked.
Fires in fireGestureEvent after a touch gesture. The <code>event</code> property contains the original gesture end event and the <code>cell</code> property contains the optional cell associated with the gesture.
Fires in tapAndHold if a tap and hold event was detected. The <code>event</code> property contains the initial touch event and the <code>cell</code> property contains the cell under the mouse or null if the background was clicked.
Fires in fireMouseEvent before the mouse listeners are invoked. The <code>eventName</code> property contains the event name and the <code>event</code> property contains the mxMouseEvent.
Fires after sizeDidChange was executed. The <code>bounds</code> property contains the new graph bounds.
Fires before the in-place editor starts in startEditingAtCell. The <code>cell</code> property contains the cell that is being edited and the <code>event</code> property contains the optional event argument that was passed to startEditingAtCell.
Fires after the in-place editor starts in startEditingAtCell. The <code>cell</code> property contains the cell that is being edited and the <code>event</code> property contains the optional event argument that was passed to startEditingAtCell.
Fires after the in-place editor stops in stopEditing.
Fires between begin- and endUpdate in cellLabelChanged. The <code>cell</code> property contains the cell, the <code>value</code> property contains the new value for the cell, the <code>old</code> property contains the old value and the optional <code>event</code> property contains the mouse event that started the edit.
Fires after an overlay is added in addCellOverlay. The <code>cell</code> property contains the cell and the <code>overlay</code> property contains the mxCellOverlay that was added.
Fires after an overlay is removed in removeCellOverlay and removeCellOverlays. The <code>cell</code> property contains the cell and the <code>overlay</code> property contains the mxCellOverlay that was removed.
function mxGraph( container, model, renderHint, stylesheet )
Constructs a new mxGraph in the specified container. Model is an optional mxGraphModel. If no model is provided, a new mxGraphModel instance is used as the model. The container must have a valid owner document prior to calling this function in Internet Explorer. RenderHint is a string to affect the display performance and rendering in IE, but not in SVG-based browsers. The parameter is mapped to dialect, which may be one of mxConstants.DIALECT_SVG for SVG-based browsers, mxConstants.DIALECT_STRICTHTML for fastest display mode, mxConstants.DIALECT_PREFERHTML for faster display mode, mxConstants.DIALECT_MIXEDHTML for fast and mxConstants.DIALECT_VML for exact display mode (slowest). The dialects are defined in mxConstants. The default values are DIALECT_SVG for SVG-based browsers and DIALECT_MIXED for IE.
| fast | The parameter is based on the fact that the display performance is highly improved in IE if the VML is not contained within a VML group element. The lack of a group element only slightly affects the display while panning, but improves the performance by almost a factor of 2, while keeping the display sufficiently accurate. This also allows to render certain shapes as HTML if the display accuracy is not affected, which is implemented by <mxShape.isMixedModeHtml>. This is the default setting and is mapped to DIALECT_MIXEDHTML. |
| faster | Same as fast, but more expensive shapes are avoided. This is controlled by <mxShape.preferModeHtml>. The default implementation will avoid gradients and rounded rectangles, but more significant shapes, such as rhombus, ellipse, actor and cylinder will be rendered accurately. This setting is mapped to DIALECT_PREFERHTML. |
| fastest | Almost anything will be rendered in Html. This allows for rectangles, labels and images. This setting is mapped to DIALECT_STRICTHTML. |
| exact | If accurate panning is required and if the diagram is small (up to 100 cells), then this value should be used. In this mode, a group is created that contains the VML. This allows for accurate panning and is mapped to DIALECT_VML. |
var container = document.getElementById('graph');
var graph = new mxGraph(container);| container | Optional DOM node that acts as a container for the graph. If this is null then the container can be initialized later using init. |
| model | Optional mxGraphModel that constitutes the graph data. |
| renderHint | Optional string that specifies the display accuracy and performance. Default is mxConstants.DIALECT_MIXEDHTML (for IE). |
| stylesheet | Optional mxStylesheet to be used in the graph. |
mxGraph.prototype.mouseListeners
Holds the mouse event listeners. See fireMouseEvent.
mxGraph.prototype.model
Holds the mxGraphModel that contains the cells to be displayed.
mxGraph.prototype.view
Holds the mxGraphView that caches the mxCellStates for the cells.
mxGraph.prototype.stylesheet
Holds the mxStylesheet that defines the appearance of the cells.
Use the following code to read a stylesheet into an existing graph.
var req = mxUtils.load('stylesheet.xml');
var root = req.getDocumentElement();
var dec = new mxCodec(root.ownerDocument);
dec.decode(root, graph.stylesheet);
mxGraph.prototype.selectionModel
Holds the mxGraphSelectionModel that models the current selection.
mxGraph.prototype.cellEditor
Holds the mxCellEditor that is used as the in-place editing.
mxGraph.prototype.cellRenderer
Holds the mxCellRenderer for rendering the cells in the graph.
mxGraph.prototype.multiplicities
An array of mxMultiplicities describing the allowed connections in a graph.
mxGraph.prototype.dialect
Dialect to be used for drawing the graph. Possible values are all constants in mxConstants with a DIALECT-prefix.
mxGraph.prototype.gridEnabled
Specifies if the grid is enabled. This is used in snap. Default is true.
mxGraph.prototype.portsEnabled
Specifies if ports are enabled. This is used in cellConnected to update the respective style. Default is true.
mxGraph.prototype.defaultOverlap
Value returned by getOverlap if isAllowOverlapParent returns true for the given cell. getOverlap is used in constrainChild if isConstrainChild returns true. The value specifies the portion of the child which is allowed to overlap the parent.
mxGraph.prototype.defaultParent
Specifies the default parent to be used to insert new cells. This is used in getDefaultParent. Default is null.
mxGraph.prototype.backgroundImage
Specifies the mxImage to be returned by getBackgroundImage. Default is null.
var img = new mxImage('http://www.example.com/maps/examplemap.jpg', 1024, 768);
graph.setBackgroundImage(img);
graph.view.validate();
mxGraph.prototype.pageBreaksVisible
Specifies if a dashed line should be drawn between multiple pages. Default is false. If you change this value while a graph is being displayed then you should call sizeDidChange to force an update of the display.
mxGraph.prototype.preferPageSize
Specifies if the graph size should be rounded to the next page number in sizeDidChange. This is only used if the graph container has scrollbars. Default is false.
mxGraph.prototype.pageFormat
Specifies the page format for the background page. Default is mxConstants.PAGE_FORMAT_A4_PORTRAIT. This is used as the default in mxPrintPreview and for painting the background page if pageVisible is true and the pagebreaks if pageBreaksVisible is true.
mxGraph.prototype.enabled
Specifies the return value for isEnabled. Default is true.
mxGraph.prototype.escapeEnabled
Specifies if mxKeyHandler should invoke escape when the escape key is pressed. Default is true.
mxGraph.prototype.invokesStopCellEditing
If true, when editing is to be stopped by way of selection changing, data in diagram changing or other means stopCellEditing is invoked, and changes are saved. This is implemented in a focus handler in mxCellEditor. Default is true.
mxGraph.prototype.enterStopsCellEditing
If true, pressing the enter key without pressing control or shift will stop editing and accept the new value. This is used in mxCellEditor to stop cell editing. Note: You can always use F2 and escape to stop editing. Default is false.
mxGraph.prototype.useScrollbarsForPanning
Specifies if scrollbars should be used for panning in panGraph if any scrollbars are available. If scrollbars are enabled in CSS, but no scrollbars appear because the graph is smaller than the container size, then no panning occurs if this is true. Default is true.
mxGraph.prototype.exportEnabled
Specifies the return value for canExportCell. Default is true.
mxGraph.prototype.importEnabled
Specifies the return value for canImportCell. Default is true.
mxGraph.prototype.cellsLocked
Specifies the return value for isCellLocked. Default is false.
mxGraph.prototype.cellsCloneable
Specifies the return value for isCellCloneable. Default is true.
mxGraph.prototype.cellsEditable
Specifies the return value for isCellEditable. Default is true.
mxGraph.prototype.cellsDeletable
Specifies the return value for isCellDeletable. Default is true.
mxGraph.prototype.cellsMovable
Specifies the return value for isCellMovable. Default is true.
mxGraph.prototype.edgeLabelsMovable
Specifies the return value for edges in isLabelMovable. Default is true.
mxGraph.prototype.vertexLabelsMovable
Specifies the return value for vertices in isLabelMovable. Default is false.
mxGraph.prototype.dropEnabled
Specifies the return value for isDropEnabled. Default is false.
mxGraph.prototype.splitEnabled
Specifies if dropping onto edges should be enabled. This is ignored if dropEnabled is false. If enabled, it will call splitEdge to carry out the drop operation. Default is true.
mxGraph.prototype.cellsResizable
Specifies the return value for isCellResizable. Default is true.
mxGraph.prototype.cellsBendable
Specifies the return value for isCellsBendable. Default is true.
mxGraph.prototype.cellsSelectable
Specifies the return value for isCellSelectable. Default is true.
mxGraph.prototype.autoSizeCells
Specifies if the graph should automatically update the cell size after an edit. This is used in isAutoSizeCell. Default is false.
mxGraph.prototype.autoScroll
Specifies if the graph should automatically scroll if the mouse goes near the container edge while dragging. This is only taken into account if the container has scrollbars. Default is true.
If you need this to work without scrollbars then set ignoreScrollbars to true. Please consult the ignoreScrollbars for details. In general, with no scrollbars, the use of allowAutoPanning is recommended.
mxGraph.prototype.ignoreScrollbars
Specifies if the graph should automatically scroll regardless of the scrollbars. This will scroll the container using positive values for scroll positions (ie usually only rightwards and downwards). To avoid possible conflicts with panning, set translateToScrollPosition to true.
mxGraph.prototype.translateToScrollPosition
Specifies if the graph should automatically convert the current scroll position to a translate in the graph view when a mouseUp event is received. This can be used to avoid conflicts when using autoScroll and ignoreScrollbars with no scrollbars in the container.
mxGraph.prototype.timerAutoScroll
Specifies if autoscrolling should be carried out via mxPanningManager even if the container has scrollbars. This disables scrollPointToVisible and uses mxPanningManager instead. If this is true then autoExtend is disabled. It should only be used with a scroll buffer or when scollbars are visible and scrollable in all directions. Default is false.
mxGraph.prototype.allowAutoPanning
Specifies if panning via panGraph should be allowed to implement autoscroll if no scrollbars are available in scrollPointToVisible. To enable panning inside the container, near the edge, set mxPanningManager.border to a positive value. Default is false.
mxGraph.prototype.autoExtend
Specifies if the size of the graph should be automatically extended if the mouse goes near the container edge while dragging. This is only taken into account if the container has scrollbars. Default is true. See autoScroll.
mxGraph.prototype.maximumGraphBounds
mxRectangle that specifies the area in which all cells in the diagram should be placed. Uses in getMaximumGraphBounds. Use a width or height of 0 if you only want to give a upper, left corner.
mxGraph.prototype.minimumGraphSize
mxRectangle that specifies the minimum size of the graph. This is ignored if the graph container has no scrollbars. Default is null.
mxGraph.prototype.minimumContainerSize
mxRectangle that specifies the minimum size of the <container> if resizeContainer is true.
mxGraph.prototype.maximumContainerSize
mxRectangle that specifies the maximum size of the container if resizeContainer is true.
mxGraph.prototype.keepEdgesInForeground
Specifies if edges should appear in the foreground regardless of their order in the model. If keepEdgesInForeground and keepEdgesInBackground are both true then the normal order is applied. Default is false.
mxGraph.prototype.keepEdgesInBackground
Specifies if edges should appear in the background regardless of their order in the model. If keepEdgesInForeground and keepEdgesInBackground are both true then the normal order is applied. Default is false.
mxGraph.prototype.constrainRelativeChildren
Specifies if child cells with relative geometries should be constrained inside the parent bounds, if constrainChildren is true, and/or the maximumGraphBounds. Default is false.
mxGraph.prototype.extendParents
Specifies if a parent should contain the child bounds after a resize of the child. Default is true. This has precedence over constrainChildren.
mxGraph.prototype.extendParentsOnAdd
Specifies if parents should be extended according to the extendParents switch if cells are added. Default is true.
Specifies if parents should be extended according to the extendParents switch if cells are added. Default is false for backwards compatiblity.
mxGraph.prototype.recursiveResize
Specifies the return value for isRecursiveResize. Default is false for backwards compatiblity.
mxGraph.prototype.defaultLoopStyle
mxEdgeStyle to be used for loops. This is a fallback for loops if the mxConstants.STYLE_LOOP is undefined. Default is mxEdgeStyle.Loop.
mxGraph.prototype.labelsVisible
Specifies if labels should be visible. This is used in getLabel. Default is true.
mxGraph.prototype.htmlLabels
Specifies the return value for isHtmlLabel. Default is false.
mxGraph.prototype.swimlaneIndicatorColorAttribute
The attribute used to find the color for the indicator if the indicator color is set to ‘swimlane’. Default is mxConstants.STYLE_FILLCOLOR.
mxGraph.prototype.minFitScale
Specifies the minimum scale to be applied in fit. Default is 0.1. Set this to null to allow any value.
mxGraph.prototype.maxFitScale
Specifies the maximum scale to be applied in fit. Default is 8. Set this to null to allow any value.
mxGraph.prototype.collapsedImage
Specifies the mxImage to indicate a collapsed state. Default value is mxClient.imageBasePath + ‘/collapsed.gif’
mxGraph.prototype.expandedImage
Specifies the mxImage to indicate a expanded state. Default value is mxClient.imageBasePath + ‘/expanded.gif’
mxGraph.prototype.warningImage
Specifies the mxImage for the image to be used to display a warning overlay. See setCellWarning. Default value is mxClient.imageBasePath + ‘/warning’. The extension for the image depends on the platform. It is ‘.png’ on the Mac and ‘.gif’ on all other platforms.
mxGraph.prototype.alreadyConnectedResource
Specifies the resource key for the error message to be displayed in non-multigraphs when two vertices are already connected. If the resource for this key does not exist then the value is used as the error message. Default is ‘alreadyConnected’.
mxGraph.prototype.containsValidationErrorsResource
Specifies the resource key for the warning message to be displayed when a collapsed cell contains validation errors. If the resource for this key does not exist then the value is used as the warning message. Default is ‘containsValidationErrors’.
mxGraph.prototype.createHandlers = function()
Creates the tooltip-, panning-, connection- and graph-handler (in this order). This is called in the constructor before init is called.
mxGraph.prototype.createTooltipHandler = function()
Creates and returns a new mxTooltipHandler to be used in this graph.
mxGraph.prototype.createSelectionCellsHandler = function()
Creates and returns a new mxTooltipHandler to be used in this graph.
mxGraph.prototype.createConnectionHandler = function()
Creates and returns a new mxConnectionHandler to be used in this graph.
mxGraph.prototype.createGraphHandler = function()
Creates and returns a new mxGraphHandler to be used in this graph.
mxGraph.prototype.createPanningHandler = function()
Creates and returns a new mxPanningHandler to be used in this graph.
mxGraph.prototype.createPopupMenuHandler = function()
Creates and returns a new mxPopupMenuHandler to be used in this graph.
mxGraph.prototype.createSelectionModel = function()
Creates a new mxGraphSelectionModel to be used in this graph.
mxGraph.prototype.createStylesheet = function()
Creates a new mxGraphSelectionModel to be used in this graph.
mxGraph.prototype.createGraphView = function()
Creates a new mxGraphView to be used in this graph.
mxGraph.prototype.createCellRenderer = function()
Creates a new mxCellRenderer to be used in this graph.
mxGraph.prototype.createCellEditor = function()
Creates a new mxCellEditor to be used in this graph.
mxGraph.prototype.getModel = function()
Returns the mxGraphModel that contains the cells.
mxGraph.prototype.getView = function()
Returns the mxGraphView that contains the mxCellStates.
mxGraph.prototype.getStylesheet = function()
Returns the mxStylesheet that defines the style.
mxGraph.prototype.setStylesheet = function( stylesheet )
Sets the mxStylesheet that defines the style.
mxGraph.prototype.getSelectionModel = function()
Returns the mxGraphSelectionModel that contains the selection.
mxGraph.prototype.graphModelChanged = function( changes )
Called when the graph model changes. Invokes processChange on each item of the given array to update the view accordingly.
| changes | Array that contains the individual changes. |
mxGraph.prototype.processChange = function( change )
Processes the given change and invalidates the respective cached data in view. This fires a <root> event if the root has changed in the model.
| change | Object that represents the change on the model. |
mxGraph.prototype.removeStateForCell = function( cell )
Removes all cached information for the given cell and its descendants. This is called when a cell was removed from the model.
| cell | mxCell that was removed from the model. |
mxGraph.prototype.addCellOverlay = function( cell, overlay )
Adds an mxCellOverlay for the specified cell. This method fires an <addoverlay> event and returns the new mxCellOverlay.
| cell | mxCell to add the overlay for. |
| overlay | mxCellOverlay to be added for the cell. |
mxGraph.prototype.getCellOverlays = function( cell )
Returns the array of mxCellOverlays for the given cell or null, if no overlays are defined.
| cell | mxCell whose overlays should be returned. |
mxGraph.prototype.removeCellOverlay = function( cell, overlay )
Removes and returns the given mxCellOverlay from the given cell. This method fires a <removeoverlay> event. If no overlay is given, then all overlays are removed using <removeOverlays>.
| cell | mxCell whose overlay should be removed. |
| overlay | Optional mxCellOverlay to be removed. |
mxGraph.prototype.removeCellOverlays = function( cell )
Removes all mxCellOverlays from the given cell. This method fires a <removeoverlay> event for each mxCellOverlay and returns the array of mxCellOverlays that was removed from the cell.
| cell | mxCell whose overlays should be removed |
mxGraph.prototype.clearCellOverlays = function( cell )
Removes all mxCellOverlays in the graph for the given cell and all its descendants. If no cell is specified then all overlays are removed from the graph. This implementation uses removeCellOverlays to remove the overlays from the individual cells.
| cell | Optional mxCell that represents the root of the subtree to remove the overlays from. Default is the root in the model. |
mxGraph.prototype.setCellWarning = function( cell, warning, img, isSelect )
Creates an overlay for the given cell using the warning and image or warningImage and returns the new mxCellOverlay. The warning is displayed as a tooltip in a red font and may contain HTML markup. If the warning is null or a zero length string, then all overlays are removed from the cell.
graph.setCellWarning(cell, '<b>Warning:</b>: Hello, World!');
| cell | mxCell whose warning should be set. |
| warning | String that represents the warning to be displayed. |
| img | Optional mxImage to be used for the overlay. Default is warningImage. |
| isSelect | Optional boolean indicating if a click on the overlay should select the corresponding cell. Default is false. |
mxGraph.prototype.startEditing = function( evt )
Calls startEditingAtCell using the given cell or the first selection cell.
| evt | Optional mouse event that triggered the editing. |
mxGraph.prototype.startEditingAtCell = function( cell, evt )
Fires a startEditing event and invokes mxCellEditor.startEditing on <editor>. After editing was started, a <editingStarted> event is fired.
| cell | mxCell to start the in-place editor for. |
| evt | Optional mouse event that triggered the editing. |
mxGraph.prototype.getEditingValue = function( cell, evt )
Returns the initial value for in-place editing. This implementation returns convertValueToString for the given cell. If this function is overridden, then mxGraphModel.valueForCellChanged should take care of correctly storing the actual new value inside the user object.
| cell | mxCell for which the initial editing value should be returned. |
| evt | Optional mouse event that triggered the editor. |
mxGraph.prototype.labelChanged = function( cell, value, evt )
Sets the label of the specified cell to the given value using cellLabelChanged and fires mxEvent.LABEL_CHANGED while the transaction is in progress. Returns the cell whose label was changed.
| cell | mxCell whose label should be changed. |
| value | New label to be assigned. |
| evt | Optional event that triggered the change. |
mxGraph.prototype.cellLabelChanged = function( cell, value, autoSize )
Sets the new label for a cell. If autoSize is true then cellSizeUpdated will be called.
In the following example, the function is extended to map changes to attributes in an XML node, as shown in convertValueToString. Alternatively, the handling of this can be implemented as shown in mxGraphModel.valueForCellChanged without the need to clone the user object.
var graphCellLabelChanged = graph.cellLabelChanged;
graph.cellLabelChanged = function(cell, newValue, autoSize)
{
// Cloned for correct undo/redo
var elt = cell.value.cloneNode(true);
elt.setAttribute('label', newValue);
newValue = elt;
graphCellLabelChanged.apply(this, arguments);
};| cell | mxCell whose label should be changed. |
| value | New label to be assigned. |
| autoSize | Boolean that specifies if cellSizeUpdated should be called. |
mxGraph.prototype.click = function( me )
Processes a singleclick on an optional cell and fires a click event. The click event is fired initially. If the graph is enabled and the event has not been consumed, then the cell is selected using selectCellForEvent or the selection is cleared using clearSelection. The events consumed state is set to true if the corresponding mxMouseEvent has been consumed.
To handle a click event, use the following code.
graph.addListener(mxEvent.CLICK, function(sender, evt)
{
var e = evt.getProperty('event'); // mouse event
var cell = evt.getProperty('cell'); // cell may be null
if (cell != null)
{
// Do something useful with cell and consume the event
evt.consume();
}
});| me | mxMouseEvent that represents the single click. |
mxGraph.prototype.dblClick = function( evt, cell )
Processes a doubleclick on an optional cell and fires a <dblclick> event. The event is fired initially. If the graph is enabled and the event has not been consumed, then <edit> is called with the given cell. The event is ignored if no cell was specified.
Example for overriding this method.
graph.dblClick = function(evt, cell)
{
var mxe = new mxEventObject(mxEvent.DOUBLE_CLICK, 'event', evt, 'cell', cell);
this.fireEvent(mxe);
if (this.isEnabled() && !mxEvent.isConsumed(evt) && !mxe.isConsumed())
{
mxUtils.alert('Hello, World!');
mxe.consume();
}
}Example listener for this event.
graph.addListener(mxEvent.DOUBLE_CLICK, function(sender, evt)
{
var cell = evt.getProperty('cell');
// do something with the cell and consume the
// event to prevent in-place editing from start
});| evt | Mouseevent that represents the doubleclick. |
| cell | Optional mxCell under the mousepointer. |
mxGraph.prototype.tapAndHold = function( me )
Handles the mxMouseEvent by highlighting the mxCellState.
| me | mxMouseEvent that represents the touch event. |
| state | Optional mxCellState that is associated with the event. |
mxGraph.prototype.createPanningManager = function()
Creates and returns an mxPanningManager.
mxGraph.prototype.getBorderSizes = function()
Returns the size of the border and padding on all four sides of the container. The left, top, right and bottom borders are stored in the x, y, width and height of the returned mxRectangle, respectively.
mxGraph.prototype.getPreferredPageSize = function( bounds, width, height )
Returns the preferred size of the background page if preferPageSize is true.
mxGraph.prototype.fit = function( border, keepOrigin, margin, enabled, ignoreWidth, ignoreHeight, maxHeight )
Scales the graph such that the complete diagram fits into <container> and returns the current scale in the view. To fit an initial graph prior to rendering, set mxGraphView.rendering to false prior to changing the model and execute the following after changing the model.
graph.fit(); graph.view.rendering = true; graph.refresh();
To fit and center the graph, the following code can be used.
var margin = 2; var max = 3; var bounds = graph.getGraphBounds(); var cw = graph.container.clientWidth - margin; var ch = graph.container.clientHeight - margin; var w = bounds.width / graph.view.scale; var h = bounds.height / graph.view.scale; var s = Math.min(max, Math.min(cw / w, ch / h)); graph.view.scaleAndTranslate(s, (margin + cw - w * s) / (2 * s) - bounds.x / graph.view.scale, (margin + ch - h * s) / (2 * s) - bounds.y / graph.view.scale);
| border | Optional number that specifies the border. Default is border. |
| keepOrigin | Optional boolean that specifies if the translate should be changed. Default is false. |
| margin | Optional margin in pixels. Default is 0. |
| enabled | Optional boolean that specifies if the scale should be set or just returned. Default is true. |
| ignoreWidth | Optional boolean that specifies if the width should be ignored. Default is false. |
| ignoreHeight | Optional boolean that specifies if the height should be ignored. Default is false. |
| maxHeight | Optional maximum height. |
mxGraph.prototype.updatePageBreaks = function( visible, width, height )
Invokes from sizeDidChange to redraw the page breaks.
| visible | Boolean that specifies if page breaks should be shown. |
| width | Specifies the width of the container in pixels. |
| height | Specifies the height of the container in pixels. |
mxGraph.prototype.getCellStyle = function( cell )
Returns an array of key, value pairs representing the cell style for the given cell. If no string is defined in the model that specifies the style, then the default style for the cell is returned or an empty object, if no style can be found. Note: You should try and get the cell state for the given cell and use the cached style in the state before using this method.
| cell | mxCell whose style should be returned as an array. |
mxGraph.prototype.setCellStyle = function( style, cells )
Sets the style of the specified cells. If no cells are given, then the selection cells are changed.
| style | String representing the new style of the cells. |
| cells | Optional array of mxCells to set the style for. Default is the selection cells. |
mxGraph.prototype.toggleCellStyle = function( key, defaultValue, cell )
Toggles the boolean value for the given key in the style of the given cell and returns the new value as 0 or 1. If no cell is specified then the selection cell is used.
| key | String representing the key for the boolean value to be toggled. |
| defaultValue | Optional boolean default value if no value is defined. Default is false. |
| cell | Optional mxCell whose style should be modified. Default is the selection cell. |
mxGraph.prototype.toggleCellStyles = function( key, defaultValue, cells )
Toggles the boolean value for the given key in the style of the given cells and returns the new value as 0 or 1. If no cells are specified, then the selection cells are used. For example, this can be used to toggle mxConstants.STYLE_ROUNDED or any other style with a boolean value.
| key | String representing the key for the boolean value to be toggled. |
| defaultValue | Optional boolean default value if no value is defined. Default is false. |
| cells | Optional array of mxCells whose styles should be modified. Default is the selection cells. |
mxGraph.prototype.setCellStyles = function( key, value, cells )
Sets the key to value in the styles of the given cells. This will modify the existing cell styles in-place and override any existing assignment for the given key. If no cells are specified, then the selection cells are changed. If no value is specified, then the respective key is removed from the styles.
| key | String representing the key to be assigned. |
| value | String representing the new value for the key. |
| cells | Optional array of mxCells to change the style for. Default is the selection cells. |
mxGraph.prototype.toggleCellStyleFlags = function( key, flag, cells )
Toggles the given bit for the given key in the styles of the specified cells.
| key | String representing the key to toggle the flag in. |
| flag | Integer that represents the bit to be toggled. |
| cells | Optional array of mxCells to change the style for. Default is the selection cells. |
mxGraph.prototype.setCellStyleFlags = function( key, flag, value, cells )
Sets or toggles the given bit for the given key in the styles of the specified cells.
| key | String representing the key to toggle the flag in. |
| flag | Integer that represents the bit to be toggled. |
| value | Boolean value to be used or null if the value should be toggled. |
| cells | Optional array of mxCells to change the style for. Default is the selection cells. |
mxGraph.prototype.alignCells = function( align, cells, param )
Aligns the given cells vertically or horizontally according to the given alignment using the optional parameter as the coordinate.
| align | Specifies the alignment. Possible values are all constants in mxConstants with an ALIGN prefix. |
| cells | Array of mxCells to be aligned. |
| param | Optional coordinate for the alignment. |
mxGraph.prototype.flipEdge = function( edge )
Toggles the style of the given edge between null (or empty) and alternateEdgeStyle. This method fires mxEvent.FLIP_EDGE while the transaction is in progress. Returns the edge that was flipped.
Here is an example that overrides this implementation to invert the value of mxConstants.STYLE_ELBOW without removing any existing styles.
graph.flipEdge = function(edge)
{
if (edge != null)
{
var state = this.view.getState(edge);
var style = (state != null) ? state.style : this.getCellStyle(edge);
if (style != null)
{
var elbow = mxUtils.getValue(style, mxConstants.STYLE_ELBOW,
mxConstants.ELBOW_HORIZONTAL);
var value = (elbow == mxConstants.ELBOW_HORIZONTAL) ?
mxConstants.ELBOW_VERTICAL : mxConstants.ELBOW_HORIZONTAL;
this.setCellStyles(mxConstants.STYLE_ELBOW, value, [edge]);
}
}
};| edge | mxCell whose style should be changed. |
mxGraph.prototype.addImageBundle = function( bundle )
Adds the specified mxImageBundle.
mxGraph.prototype.removeImageBundle = function( bundle )
Removes the specified mxImageBundle.
mxGraph.prototype.getImageFromBundles = function( key )
Searches all imageBundles for the specified key and returns the value for the first match or null if the key is not found.
mxGraph.prototype.orderCells = function( back, cells )
Moves the given cells to the front or back. The change is carried out using cellsOrdered. This method fires mxEvent.ORDER_CELLS while the transaction is in progress.
| back | Boolean that specifies if the cells should be moved to back. |
| cells | Array of mxCells to move to the background. If null is specified then the selection cells are used. |
mxGraph.prototype.cellsOrdered = function( cells, back )
Moves the given cells to the front or back. This method fires mxEvent.CELLS_ORDERED while the transaction is in progress.
| cells | Array of mxCells whose order should be changed. |
| back | Boolean that specifies if the cells should be moved to back. |
mxGraph.prototype.groupCells = function( group, border, cells )
Adds the cells into the given group. The change is carried out using cellsAdded, cellsMoved and cellsResized. This method fires mxEvent.GROUP_CELLS while the transaction is in progress. Returns the new group. A group is only created if there is at least one entry in the given array of cells.
| group | mxCell that represents the target group. If null is specified then a new group is created using createGroupCell. |
| border | Optional integer that specifies the border between the child area and the group bounds. Default is 0. |
| cells | Optional array of mxCells to be grouped. If null is specified then the selection cells are used. |
mxGraph.prototype.createGroupCell = function( cells )
Hook for creating the group cell to hold the given array of mxCells if no group cell was given to the <group> function.
The following code can be used to set the style of new group cells.
var graphCreateGroupCell = graph.createGroupCell;
graph.createGroupCell = function(cells)
{
var group = graphCreateGroupCell.apply(this, arguments);
group.setStyle('group');
return group;
};
mxGraph.prototype.ungroupCells = function( cells )
Ungroups the given cells by moving the children the children to their parents parent and removing the empty groups. Returns the children that have been removed from the groups.
| cells | Array of cells to be ungrouped. If null is specified then the selection cells are used. |
mxGraph.prototype.removeCellsAfterUngroup = function( cells )
Hook to remove the groups after ungroupCells.
| cells | Array of mxCells that were ungrouped. |
mxGraph.prototype.removeCellsFromParent = function( cells )
Removes the specified cells from their parents and adds them to the default parent. Returns the cells that were removed from their parents.
| cells | Array of mxCells to be removed from their parents. |
mxGraph.prototype.updateGroupBounds = function( cells, border, moveGroup, topBorder, rightBorder, bottomBorder, leftBorder )
Updates the bounds of the given groups to include all children and returns the passed-in cells. Call this with the groups in parent to child order, top-most group first, the cells are processed in reverse order and cells with no children are ignored.
| cells | The groups whose bounds should be updated. If this is null, then the selection cells are used. |
| border | Optional border to be added in the group. Default is 0. |
| moveGroup | Optional boolean that allows the group to be moved. Default is false. |
| topBorder | Optional top border to be added in the group. Default is 0. |
| rightBorder | Optional top border to be added in the group. Default is 0. |
| bottomBorder | Optional top border to be added in the group. Default is 0. |
| leftBorder | Optional top border to be added in the group. Default is 0. |
mxGraph.prototype.getBoundingBox = function( cells )
Returns the bounding box for the given array of mxCells. The bounding box for each cell and its descendants is computed using mxGraphView.getBoundingBox.
| cells | Array of mxCells whose bounding box should be returned. |
mxGraph.prototype.cloneCell = function( cell, allowInvalidEdges, mapping, keepPosition )
Returns the clone for the given cell. Uses cloneCells.
| cell | mxCell to be cloned. |
| allowInvalidEdges | Optional boolean that specifies if invalid edges should be cloned. Default is true. |
| mapping | Optional mapping for existing clones. |
| keepPosition | Optional boolean indicating if the position of the cells should be updated to reflect the lost parent cell. Default is false. |
mxGraph.prototype.cloneCells = function( cells, allowInvalidEdges, mapping, keepPosition )
Returns the clones for the given cells. The clones are created recursively using mxGraphModel.cloneCells. If the terminal of an edge is not in the given array, then the respective end is assigned a terminal point and the terminal is removed.
| cells | Array of mxCells to be cloned. |
| allowInvalidEdges | Optional boolean that specifies if invalid edges should be cloned. Default is true. |
| mapping | Optional mapping for existing clones. |
| keepPosition | Optional boolean indicating if the position of the cells should be updated to reflect the lost parent cell. Default is false. |
mxGraph.prototype.insertVertex = function( parent, id, value, x, y, width, height, style, relative )
Adds a new vertex into the given parent mxCell using value as the user object and the given coordinates as the mxGeometry of the new vertex. The id and style are used for the respective properties of the new mxCell, which is returned.
When adding new vertices from a mouse event, one should take into account the offset of the graph container and the scale and translation of the view in order to find the correct unscaled, untranslated coordinates using mxGraph.getPointForEvent as follows:
var pt = graph.getPointForEvent(evt);
var parent = graph.getDefaultParent();
graph.insertVertex(parent, null,
'Hello, World!', x, y, 220, 30);For adding image cells, the style parameter can be assigned as
stylename;image=imageUrl
See mxGraph for more information on using images.
| parent | mxCell that specifies the parent of the new vertex. |
| id | Optional string that defines the Id of the new vertex. |
| value | Object to be used as the user object. |
| x | Integer that defines the x coordinate of the vertex. |
| y | Integer that defines the y coordinate of the vertex. |
| width | Integer that defines the width of the vertex. |
| height | Integer that defines the height of the vertex. |
| style | Optional string that defines the cell style. |
| relative | Optional boolean that specifies if the geometry is relative. Default is false. |
mxGraph.prototype.createVertex = function( parent, id, value, x, y, width, height, style, relative )
Hook method that creates the new vertex for insertVertex.
mxGraph.prototype.insertEdge = function( parent, id, value, source, target, style )
Adds a new edge into the given parent mxCell using value as the user object and the given source and target as the terminals of the new edge. The id and style are used for the respective properties of the new mxCell, which is returned.
| parent | mxCell that specifies the parent of the new edge. |
| id | Optional string that defines the Id of the new edge. |
| value | JavaScript object to be used as the user object. |
| source | mxCell that defines the source of the edge. |
| target | mxCell that defines the target of the edge. |
| style | Optional string that defines the cell style. |
mxGraph.prototype.createEdge = function( parent, id, value, source, target, style )
Hook method that creates the new edge for insertEdge. This implementation does not set the source and target of the edge, these are set when the edge is added to the model.
mxGraph.prototype.addEdge = function( edge, parent, source, target, index )
Adds the edge to the parent and connects it to the given source and target terminals. This is a shortcut method. Returns the edge that was added.
| edge | mxCell to be inserted into the given parent. |
| parent | mxCell that represents the new parent. If no parent is given then the default parent is used. |
| source | Optional mxCell that represents the source terminal. |
| target | Optional mxCell that represents the target terminal. |
| index | Optional index to insert the cells at. Default is to append. |
mxGraph.prototype.addCell = function( cell, parent, index, source, target )
Adds the cell to the parent and connects it to the given source and target terminals. This is a shortcut method. Returns the cell that was added.
| cell | mxCell to be inserted into the given parent. |
| parent | mxCell that represents the new parent. If no parent is given then the default parent is used. |
| index | Optional index to insert the cells at. Default is to append. |
| source | Optional mxCell that represents the source terminal. |
| target | Optional mxCell that represents the target terminal. |
mxGraph.prototype.addCells = function( cells, parent, index, source, target )
Adds the cells to the parent at the given index, connecting each cell to the optional source and target terminal. The change is carried out using cellsAdded. This method fires mxEvent.ADD_CELLS while the transaction is in progress. Returns the cells that were added.
| cells | Array of mxCells to be inserted. |
| parent | mxCell that represents the new parent. If no parent is given then the default parent is used. |
| index | Optional index to insert the cells at. Default is to append. |
| source | Optional source mxCell for all inserted cells. |
| target | Optional target mxCell for all inserted cells. |
mxGraph.prototype.cellsAdded = function( cells, parent, index, source, target, absolute, constrain, extend )
Adds the specified cells to the given parent. This method fires mxEvent.CELLS_ADDED while the transaction is in progress.
mxGraph.prototype.autoSizeCell = function( cell, recurse )
Resizes the specified cell to just fit around the its label and/or children
| cell | mxCells to be resized. |
| recurse | Optional boolean which specifies if all descendants should be autosized. Default is true. |
mxGraph.prototype.removeCells = function( cells, includeEdges )
Removes the given cells from the graph including all connected edges if includeEdges is true. The change is carried out using cellsRemoved. This method fires mxEvent.REMOVE_CELLS while the transaction is in progress. The removed cells are returned as an array.
| cells | Array of mxCells to remove. If null is specified then the selection cells which are deletable are used. |
| includeEdges | Optional boolean which specifies if all connected edges should be removed as well. Default is true. |
mxGraph.prototype.cellsRemoved = function( cells )
Removes the given cells from the model. This method fires mxEvent.CELLS_REMOVED while the transaction is in progress.
| cells | Array of mxCells to remove. |
mxGraph.prototype.splitEdge = function( edge, cells, newEdge, dx, dy )
Splits the given edge by adding the newEdge between the previous source and the given cell and reconnecting the source of the given edge to the given cell. This method fires mxEvent.SPLIT_EDGE while the transaction is in progress. Returns the new edge that was inserted.
| edge | mxCell that represents the edge to be splitted. |
| cells | mxCells that represents the cells to insert into the edge. |
| newEdge | mxCell that represents the edge to be inserted. |
| dx | Optional integer that specifies the vector to move the cells. |
| dy | Optional integer that specifies the vector to move the cells. |
mxGraph.prototype.toggleCells = function( show, cells, includeEdges )
Sets the visible state of the specified cells and all connected edges if includeEdges is true. The change is carried out using cellsToggled. This method fires mxEvent.TOGGLE_CELLS while the transaction is in progress. Returns the cells whose visible state was changed.
| show | Boolean that specifies the visible state to be assigned. |
| cells | Array of mxCells whose visible state should be changed. If null is specified then the selection cells are used. |
| includeEdges | Optional boolean indicating if the visible state of all connected edges should be changed as well. Default is true. |
mxGraph.prototype.cellsToggled = function( cells, show )
Sets the visible state of the specified cells.
| cells | Array of mxCells whose visible state should be changed. |
| show | Boolean that specifies the visible state to be assigned. |
mxGraph.prototype.foldCells = function( collapse, recurse, cells, checkFoldable, evt )
Sets the collapsed state of the specified cells and all descendants if recurse is true. The change is carried out using cellsFolded. This method fires mxEvent.FOLD_CELLS while the transaction is in progress. Returns the cells whose collapsed state was changed.
| collapsed | Boolean indicating the collapsed state to be assigned. |
| recurse | Optional boolean indicating if the collapsed state of all descendants should be set. Default is false. |
| cells | Array of mxCells whose collapsed state should be set. If null is specified then the foldable selection cells are used. |
| checkFoldable | Optional boolean indicating of isCellFoldable should be checked. Default is false. |
| evt | Optional native event that triggered the invocation. |
mxGraph.prototype.cellsFolded = function( cells, collapse, recurse, checkFoldable )
Sets the collapsed state of the specified cells. This method fires mxEvent.CELLS_FOLDED while the transaction is in progress. Returns the cells whose collapsed state was changed.
| cells | Array of mxCells whose collapsed state should be set. |
| collapsed | Boolean indicating the collapsed state to be assigned. |
| recurse | Boolean indicating if the collapsed state of all descendants should be set. |
| checkFoldable | Optional boolean indicating of isCellFoldable should be checked. Default is false. |
mxGraph.prototype.swapBounds = function( cell, willCollapse )
Swaps the alternate and the actual bounds in the geometry of the given cell invoking updateAlternateBounds before carrying out the swap.
| cell | mxCell for which the bounds should be swapped. |
| willCollapse | Boolean indicating if the cell is going to be collapsed. |
mxGraph.prototype.updateAlternateBounds = function( cell, geo, willCollapse )
Updates or sets the alternate bounds in the given geometry for the given cell depending on whether the cell is going to be collapsed. If no alternate bounds are defined in the geometry and collapseToPreferredSize is true, then the preferred size is used for the alternate bounds. The top, left corner is always kept at the same location.
| cell | mxCell for which the geometry is being udpated. |
| g | mxGeometry for which the alternate bounds should be updated. |
| willCollapse | Boolean indicating if the cell is going to be collapsed. |
mxGraph.prototype.updateCellSize = function( cell, ignoreChildren )
Updates the size of the given cell in the model using cellSizeUpdated. This method fires mxEvent.UPDATE_CELL_SIZE while the transaction is in progress. Returns the cell whose size was updated.
| cell | mxCell whose size should be updated. |
mxGraph.prototype.cellSizeUpdated = function( cell, ignoreChildren )
Updates the size of the given cell in the model using getPreferredSizeForCell to get the new size.
| cell | mxCell for which the size should be changed. |
mxGraph.prototype.getPreferredSizeForCell = function( cell )
Returns the preferred width and height of the given mxCell as an mxRectangle. To implement a minimum width, add a new style eg. minWidth in the vertex and override this method as follows.
var graphGetPreferredSizeForCell = graph.getPreferredSizeForCell;
graph.getPreferredSizeForCell = function(cell)
{
var result = graphGetPreferredSizeForCell.apply(this, arguments);
var style = this.getCellStyle(cell);
if (style['minWidth'] > 0)
{
result.width = Math.max(style['minWidth'], result.width);
}
return result;
};| cell | mxCell for which the preferred size should be returned. |
mxGraph.prototype.resizeCell = function( cell, bounds, recurse )
Sets the bounds of the given cell using resizeCells. Returns the cell which was passed to the function.
| cell | mxCell whose bounds should be changed. |
| bounds | mxRectangle that represents the new bounds. |
mxGraph.prototype.resizeCells = function( cells, bounds, recurse )
Sets the bounds of the given cells and fires a mxEvent.RESIZE_CELLS event while the transaction is in progress. Returns the cells which have been passed to the function.
| cells | Array of mxCells whose bounds should be changed. |
| bounds | Array of mxRectangles that represent the new bounds. |
mxGraph.prototype.cellsResized = function( cells, bounds, recurse )
Sets the bounds of the given cells and fires a mxEvent.CELLS_RESIZED event. If extendParents is true, then the parent is extended if a child size is changed so that it overlaps with the parent.
The following example shows how to control group resizes to make sure that all child cells stay within the group.
graph.addListener(mxEvent.CELLS_RESIZED, function(sender, evt)
{
var cells = evt.getProperty('cells');
if (cells != null)
{
for (var i = 0; i < cells.length; i++)
{
if (graph.getModel().getChildCount(cells[i]) > 0)
{
var geo = graph.getCellGeometry(cells[i]);
if (geo != null)
{
var children = graph.getChildCells(cells[i], true, true);
var bounds = graph.getBoundingBoxFromGeometry(children, true);
geo = geo.clone();
geo.width = Math.max(geo.width, bounds.width);
geo.height = Math.max(geo.height, bounds.height);
graph.getModel().setGeometry(cells[i], geo);
}
}
}
}
});| cells | Array of mxCells whose bounds should be changed. |
| bounds | Array of mxRectangles that represent the new bounds. |
| recurse | Optional boolean that specifies if the children should be resized. |
mxGraph.prototype.cellResized = function( cell, bounds, ignoreRelative, recurse )
Resizes the parents recursively so that they contain the complete area of the resized child cell.
| cell | mxCell whose bounds should be changed. |
| bounds | mxRectangles that represent the new bounds. |
| ignoreRelative | Boolean that indicates if relative cells should be ignored. |
| recurse | Optional boolean that specifies if the children should be resized. |
mxGraph.prototype.resizeChildCells = function( cell, newGeo )
Resizes the child cells of the given cell for the given new geometry with respect to the current geometry of the cell.
| cell | mxCell that has been resized. |
| newGeo | mxGeometry that represents the new bounds. |
mxGraph.prototype.constrainChildCells = function( cell )
Constrains the children of the given cell using constrainChild.
| cell | mxCell that has been resized. |
mxGraph.prototype.scaleCell = function( cell, dx, dy, recurse )
Scales the points, position and size of the given cell according to the given vertical and horizontal scaling factors.
| cell | mxCell whose geometry should be scaled. |
| dx | Horizontal scaling factor. |
| dy | Vertical scaling factor. |
| recurse | Boolean indicating if the child cells should be scaled. |
mxGraph.prototype.extendParent = function( cell )
Resizes the parents recursively so that they contain the complete area of the resized child cell.
| cell | mxCell that has been resized. |
mxGraph.prototype.importCells = function( cells, dx, dy, target, evt, mapping )
Clones and inserts the given cells into the graph using the move method and returns the inserted cells. This shortcut is used if cells are inserted via datatransfer.
| cells | Array of mxCells to be imported. |
| dx | Integer that specifies the x-coordinate of the vector. Default is 0. |
| dy | Integer that specifies the y-coordinate of the vector. Default is 0. |
| target | mxCell that represents the new parent of the cells. |
| evt | Mouseevent that triggered the invocation. |
| mapping | Optional mapping for existing clones. |
mxGraph.prototype.moveCells = function( cells, dx, dy, clone, target, evt, mapping )
Moves or clones the specified cells and moves the cells or clones by the given amount, adding them to the optional target cell. The evt is the mouse event as the mouse was released. The change is carried out using cellsMoved. This method fires mxEvent.MOVE_CELLS while the transaction is in progress. Returns the cells that were moved.
Use the following code to move all cells in the graph.
graph.moveCells(graph.getChildCells(null, true, true), 10, 10);
| cells | Array of mxCells to be moved, cloned or added to the target. |
| dx | Integer that specifies the x-coordinate of the vector. Default is 0. |
| dy | Integer that specifies the y-coordinate of the vector. Default is 0. |
| clone | Boolean indicating if the cells should be cloned. Default is false. |
| target | mxCell that represents the new parent of the cells. |
| evt | Mouseevent that triggered the invocation. |
| mapping | Optional mapping for existing clones. |
mxGraph.prototype.cellsMoved = function( cells, dx, dy, disconnect, constrain, extend )
Moves the specified cells by the given vector, disconnecting the cells using disconnectGraph is disconnect is true. This method fires mxEvent.CELLS_MOVED while the transaction is in progress.
mxGraph.prototype.getCellContainmentArea = function( cell )
Returns the mxRectangle inside which a cell is to be kept.
| cell | mxCell for which the area should be returned. |
mxGraph.prototype.getMaximumGraphBounds = function()
Returns the bounds inside which the diagram should be kept as an mxRectangle.
mxGraph.prototype.constrainChild = function( cell, sizeFirst )
Keeps the given cell inside the bounds returned by getCellContainmentArea for its parent, according to the rules defined by getOverlap and isConstrainChild. This modifies the cell’s geometry in-place and does not clone it.
| cells | mxCell which should be constrained. |
| sizeFirst | Specifies if the size should be changed first. Default is true. |
mxGraph.prototype.resetEdges = function( cells )
Resets the control points of the edges that are connected to the given cells if not both ends of the edge are in the given cells array.
| cells | Array of mxCells for which the connected edges should be reset. |
mxGraph.prototype.resetEdge = function( edge )
Resets the control points of the given edge.
| edge | mxCell whose points should be reset. |
mxGraph.prototype.getAllConnectionConstraints = function( terminal, source )
Returns an array of all mxConnectionConstraints for the given terminal. If the shape of the given terminal is a <mxStencilShape> then the constraints of the corresponding mxStencil are returned.
| terminal | mxCellState that represents the terminal. |
| source | Boolean that specifies if the terminal is the source or target. |
mxGraph.prototype.getConnectionConstraint = function( edge, terminal, source )
Returns an mxConnectionConstraint that describes the given connection point. This result can then be passed to getConnectionPoint.
| edge | mxCellState that represents the edge. |
| terminal | mxCellState that represents the terminal. |
| source | Boolean indicating if the terminal is the source or target. |
mxGraph.prototype.setConnectionConstraint = function( edge, terminal, source, constraint )
Sets the mxConnectionConstraint that describes the given connection point. If no constraint is given then nothing is changed. To remove an existing constraint from the given edge, use an empty constraint instead.
| edge | mxCell that represents the edge. |
| terminal | mxCell that represents the terminal. |
| source | Boolean indicating if the terminal is the source or target. |
| constraint | Optional mxConnectionConstraint to be used for this connection. |
mxGraph.prototype.getConnectionPoint = function( vertex, constraint, round )
Returns the nearest point in the list of absolute points or the center of the opposite terminal.
| vertex | mxCellState that represents the vertex. |
| constraint | mxConnectionConstraint that represents the connection point constraint as returned by getConnectionConstraint. |
mxGraph.prototype.connectCell = function( edge, terminal, source, constraint )
Connects the specified end of the given edge to the given terminal using cellConnected and fires mxEvent.CONNECT_CELL while the transaction is in progress. Returns the updated edge.
| edge | mxCell whose terminal should be updated. |
| terminal | mxCell that represents the new terminal to be used. |
| source | Boolean indicating if the new terminal is the source or target. |
| constraint | Optional mxConnectionConstraint to be used for this connection. |
mxGraph.prototype.cellConnected = function( edge, terminal, source, constraint )
Sets the new terminal for the given edge and resets the edge points if resetEdgesOnConnect is true. This method fires mxEvent.CELL_CONNECTED while the transaction is in progress.
| edge | mxCell whose terminal should be updated. |
| terminal | mxCell that represents the new terminal to be used. |
| source | Boolean indicating if the new terminal is the source or target. |
| constraint | mxConnectionConstraint to be used for this connection. |
mxGraph.prototype.disconnectGraph = function( cells )
Disconnects the given edges from the terminals which are not in the given array.
| cells | Array of mxCells to be disconnected. |
mxGraph.prototype.getCurrentRoot = function()
Returns the current root of the displayed cell hierarchy. This is a shortcut to mxGraphView.currentRoot in view.
mxGraph.prototype.getTranslateForRoot = function( cell )
Returns the translation to be used if the given cell is the root cell as an mxPoint. This implementation returns null.
To keep the children at their absolute position while stepping into groups, this function can be overridden as follows.
var offset = new mxPoint(0, 0);
while (cell != null)
{
var geo = this.model.getGeometry(cell);
if (geo != null)
{
offset.x -= geo.x;
offset.y -= geo.y;
}
cell = this.model.getParent(cell);
}
return offset;| cell | mxCell that represents the root. |
mxGraph.prototype.isPort = function( cell )
Returns true if the given cell is a “port”, that is, when connecting to it, the cell returned by getTerminalForPort should be used as the terminal and the port should be referenced by the ID in either the mxConstants.STYLE_SOURCE_PORT or the or the mxConstants.STYLE_TARGET_PORT. Note that a port should not be movable. This implementation always returns false.
graph.isPort = function(cell)
{
var geo = this.getCellGeometry(cell);
return (geo != null) ? geo.relative : false;
};| cell | mxCell that represents the port. |
mxGraph.prototype.getTerminalForPort = function( cell, source )
Returns the terminal to be used for a given port. This implementation always returns the parent cell.
| cell | mxCell that represents the port. |
| source | If the cell is the source or target port. |
mxGraph.prototype.getChildOffsetForCell = function( cell )
Returns the offset to be used for the cells inside the given cell. The root and layer cells may be identified using mxGraphModel.isRoot and mxGraphModel.isLayer. For all other current roots, the mxGraphView.currentRoot field points to the respective cell, so that the following holds: cell == this.view.currentRoot. This implementation returns null.
| cell | mxCell whose offset should be returned. |
mxGraph.prototype.enterGroup = function( cell )
Uses the given cell as the root of the displayed cell hierarchy. If no cell is specified then the selection cell is used. The cell is only used if isValidRoot returns true.
| cell | Optional mxCell to be used as the new root. Default is the selection cell. |
mxGraph.prototype.isValidRoot = function( cell )
Returns true if the given cell is a valid root for the cell display hierarchy. This implementation returns true for all non-null values.
| cell | mxCell which should be checked as a possible root. |
mxGraph.prototype.getGraphBounds = function()
Returns the bounds of the visible graph. Shortcut to mxGraphView.getGraphBounds. See also: getBoundingBoxFromGeometry.
mxGraph.prototype.getCellBounds = function( cell, includeEdges, includeDescendants )
Returns the scaled, translated bounds for the given cell. See mxGraphView.getBounds for arrays.
| cell | mxCell whose bounds should be returned. |
| includeEdge | Optional boolean that specifies if the bounds of the connected edges should be included. Default is false. |
| includeDescendants | Optional boolean that specifies if the bounds of all descendants should be included. Default is false. |
mxGraph.prototype.getBoundingBoxFromGeometry = function( cells, includeEdges )
Returns the bounding box for the geometries of the vertices in the given array of cells. This can be used to find the graph bounds during a layout operation (ie. before the last endUpdate) as follows:
var cells = graph.getChildCells(graph.getDefaultParent(), true, true); var bounds = graph.getBoundingBoxFromGeometry(cells, true);
if (bounds.x < 0 || bounds.y < 0)
{
graph.moveCells(cells, -Math.min(bounds.x, 0), -Math.min(bounds.y, 0))
}if (bounds.x < 0 || bounds.y < 0)
{
graph.view.setTranslate(-Math.min(bounds.x, 0), -Math.min(bounds.y, 0));
}| cells | Array of mxCells whose bounds should be returned. |
| includeEdges | Specifies if edge bounds should be included by computing the bounding box for all points in geometry. Default is false. |
mxGraph.prototype.refresh = function( cell )
Clears all cell states or the states for the hierarchy starting at the given cell and validates the graph. This fires a refresh event as the last step.
| cell | Optional mxCell for which the cell states should be cleared. |
mxGraph.prototype.snap = function( value )
Snaps the given numeric value to the grid if gridEnabled is true.
| value | Numeric value to be snapped to the grid. |
mxGraph.prototype.panGraph = function( dx, dy )
Shifts the graph display by the given amount. This is used to preview panning operations, use mxGraphView.setTranslate to set a persistent translation of the view. Fires mxEvent.PAN.
| dx | Amount to shift the graph along the x-axis. |
| dy | Amount to shift the graph along the y-axis. |
mxGraph.prototype.zoomIn = function()
Zooms into the graph by zoomFactor.
mxGraph.prototype.zoomOut = function()
Zooms out of the graph by zoomFactor.
mxGraph.prototype.zoomTo = function( scale, center )
Zooms the graph to the given scale with an optional boolean center argument, which is passd to zoom.
mxGraph.prototype.center = function( horizontal, vertical, cx, cy )
Centers the graph in the container.
| horizontal | Optional boolean that specifies if the graph should be centered horizontally. Default is true. |
| vertical | Optional boolean that specifies if the graph should be centered vertically. Default is true. |
| cx | Optional float that specifies the horizontal center. Default is 0.5. |
| cy | Optional float that specifies the vertical center. Default is 0.5. |
mxGraph.prototype.zoom = function( factor, center )
Zooms the graph using the given factor. Center is an optional boolean argument that keeps the graph scrolled to the center. If the center argument is omitted, then centerZoom will be used as its value.
mxGraph.prototype.zoomToRect = function( rect )
Zooms the graph to the specified rectangle. If the rectangle does not have same aspect ratio as the display container, it is increased in the smaller relative dimension only until the aspect match. The original rectangle is centralised within this expanded one.
Note that the input rectangular must be un-scaled and un-translated.
| rect | The un-scaled and un-translated rectangluar region that should be just visible after the operation |
mxGraph.prototype.scrollCellToVisible = function( cell, center )
Pans the graph so that it shows the given cell. Optionally the cell may be centered in the container.
To center a given graph if the <container> has no scrollbars, use the following code.
[code] var bounds = graph.getGraphBounds(); graph.view.setTranslate(-bounds.x - (bounds.width - container.clientWidth) / 2, -bounds.y - (bounds.height - container.clientHeight) / 2); [/code]
| cell | mxCell to be made visible. |
| center | Optional boolean flag. Default is false. |
mxGraph.prototype.scrollRectToVisible = function( rect )
Pans the graph so that it shows the given rectangle.
| rect | mxRectangle to be made visible. |
mxGraph.prototype.getCellGeometry = function( cell )
Returns the mxGeometry for the given cell. This implementation uses mxGraphModel.getGeometry. Subclasses can override this to implement specific geometries for cells in only one graph, that is, it can return geometries that depend on the current state of the view.
| cell | mxCell whose geometry should be returned. |
mxGraph.prototype.isCellVisible = function( cell )
Returns true if the given cell is visible in this graph. This implementation uses mxGraphModel.isVisible. Subclassers can override this to implement specific visibility for cells in only one graph, that is, without affecting the visible state of the cell.
When using dynamic filter expressions for cell visibility, then the graph should be revalidated after the filter expression has changed.
| cell | mxCell whose visible state should be returned. |
mxGraph.prototype.isCellCollapsed = function( cell )
Returns true if the given cell is collapsed in this graph. This implementation uses mxGraphModel.isCollapsed. Subclassers can override this to implement specific collapsed states for cells in only one graph, that is, without affecting the collapsed state of the cell.
When using dynamic filter expressions for the collapsed state, then the graph should be revalidated after the filter expression has changed.
| cell | mxCell whose collapsed state should be returned. |
mxGraph.prototype.isCellConnectable = function( cell )
Returns true if the given cell is connectable in this graph. This implementation uses mxGraphModel.isConnectable. Subclassers can override this to implement specific connectable states for cells in only one graph, that is, without affecting the connectable state of the cell in the model.
| cell | mxCell whose connectable state should be returned. |
mxGraph.prototype.isOrthogonal = function( edge )
Returns true if perimeter points should be computed such that the resulting edge has only horizontal or vertical segments.
| edge | mxCellState that represents the edge. |
mxGraph.prototype.isLoop = function( state )
Returns true if the given cell state is a loop.
| state | mxCellState that represents a potential loop. |
mxGraph.prototype.isEdgeValid = function( edge, source, target )
Checks if the return value of getEdgeValidationError for the given arguments is null.
| edge | mxCell that represents the edge to validate. |
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
mxGraph.prototype.getEdgeValidationError = function( edge, source, target )
Returns the validation error message to be displayed when inserting or changing an edges’ connectivity. A return value of null means the edge is valid, a return value of ‘’ means it’s not valid, but do not display an error message. Any other (non-empty) string returned from this method is displayed as an error message when trying to connect an edge to a source and target. This implementation uses the multiplicities, and checks multigraph, allowDanglingEdges and allowLoops to generate validation errors.
For extending this method with specific checks for source/target cells, the method can be extended as follows. Returning an empty string means the edge is invalid with no error message, a non-null string specifies the error message, and null means the edge is valid.
graph.getEdgeValidationError = function(edge, source, target)
{
if (source != null && target != null &&
this.model.getValue(source) != null &&
this.model.getValue(target) != null)
{
if (target is not valid for source)
{
return 'Invalid Target';
}
}
// "Supercall"
return mxGraph.prototype.getEdgeValidationError.apply(this, arguments);
}| edge | mxCell that represents the edge to validate. |
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
mxGraph.prototype.validateEdge = function( edge, source, target )
Hook method for subclassers to return an error message for the given edge and terminals. This implementation returns null.
| edge | mxCell that represents the edge to validate. |
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
mxGraph.prototype.validateGraph = function( cell, context )
Validates the graph by validating each descendant of the given cell or the root of the model. Context is an object that contains the validation state for the complete validation run. The validation errors are attached to their cells using setCellWarning. Returns null in the case of successful validation or an array of strings (warnings) in the case of failed validations.
| cell | Optional mxCell to start the validation recursion. Default is the graph root. |
| context | Object that represents the global validation state. |
mxGraph.prototype.getCellValidationError = function( cell )
Checks all multiplicities that cannot be enforced while the graph is being modified, namely, all multiplicities that require a minimum of 1 edge.
| cell | mxCell for which the multiplicities should be checked. |
mxGraph.prototype.validateCell = function( cell, context )
Hook method for subclassers to return an error message for the given cell and validation context. This implementation returns null. Any HTML breaks will be converted to linefeeds in the calling method.
| cell | mxCell that represents the cell to validate. |
| context | Object that represents the global validation state. |
mxGraph.prototype.getBackgroundImage = function()
Returns the backgroundImage as an mxImage.
mxGraph.prototype.setBackgroundImage = function( image )
Sets the new backgroundImage.
| image | New mxImage to be used for the background. |
mxGraph.prototype.getFoldingImage = function( state )
Returns the mxImage used to display the collapsed state of the specified cell state. This returns null for all edges.
mxGraph.prototype.convertValueToString = function( cell )
Returns the textual representation for the given cell. This implementation returns the nodename or string-representation of the user object.
The following returns the label attribute from the cells user object if it is an XML node.
graph.convertValueToString = function(cell)
{
return cell.getAttribute('label');
}See also: cellLabelChanged.
| cell | mxCell whose textual representation should be returned. |
mxGraph.prototype.getLabel = function( cell )
Returns a string or DOM node that represents the label for the given cell. This implementation uses convertValueToString if labelsVisible is true. Otherwise it returns an empty string.
To truncate a label to match the size of the cell, the following code can be used.
graph.getLabel = function(cell)
{
var label = mxGraph.prototype.getLabel.apply(this, arguments);
if (label != null && this.model.isVertex(cell))
{
var geo = this.getCellGeometry(cell);
if (geo != null)
{
var max = parseInt(geo.width / 8);
if (label.length > max)
{
label = label.substring(0, max)+'...';
}
}
}
return mxUtils.htmlEntities(label);
}A resize listener is needed in the graph to force a repaint of the label after a resize.
graph.addListener(mxEvent.RESIZE_CELLS, function(sender, evt)
{
var cells = evt.getProperty('cells');
for (var i = 0; i < cells.length; i++)
{
this.view.removeState(cells[i]);
}
});| cell | mxCell whose label should be returned. |
mxGraph.prototype.isHtmlLabel = function( cell )
Returns true if the label must be rendered as HTML markup. The default implementation returns htmlLabels.
| cell | mxCell whose label should be displayed as HTML markup. |
mxGraph.prototype.isHtmlLabels = function()
Returns htmlLabels.
mxGraph.prototype.setHtmlLabels = function( value )
Sets htmlLabels.
mxGraph.prototype.isWrapping = function( cell )
This enables wrapping for HTML labels.
Returns true if no white-space CSS style directive should be used for displaying the given cells label. This implementation returns true if mxConstants.STYLE_WHITE_SPACE in the style of the given cell is ‘wrap’.
This is used as a workaround for IE ignoring the white-space directive of child elements if the directive appears in a parent element. It should be overridden to return true if a white-space directive is used in the HTML markup that represents the given cells label. In order for HTML markup to work in labels, isHtmlLabel must also return true for the given cell.
graph.getLabel = function(cell)
{
var tmp = mxGraph.prototype.getLabel.apply(this, arguments); // "supercall"
if (this.model.isEdge(cell))
{
tmp = '<div style="width: 150px; white-space:normal;">'+tmp+'</div>';
}
return tmp;
}
graph.isWrapping = function(state)
{
return this.model.isEdge(state.cell);
}Makes sure no edge label is wider than 150 pixels, otherwise the content is wrapped. Note: No width must be specified for wrapped vertex labels as the vertex defines the width in its geometry.
| state | mxCell whose label should be wrapped. |
mxGraph.prototype.isLabelClipped = function( cell )
Returns true if the overflow portion of labels should be hidden. If this returns true then vertex labels will be clipped to the size of the vertices. This implementation returns true if mxConstants.STYLE_OVERFLOW in the style of the given cell is ‘hidden’.
| state | mxCell whose label should be clipped. |
mxGraph.prototype.getTooltip = function( state, node, x, y )
Returns the string or DOM node that represents the tooltip for the given state, node and coordinate pair. This implementation checks if the given node is a folding icon or overlay and returns the respective tooltip. If this does not result in a tooltip, the handler for the cell is retrieved from <selectionCellsHandler> and the optional getTooltipForNode method is called. If no special tooltip exists here then getTooltipForCell is used with the cell in the given state as the argument to return a tooltip for the given state.
| state | mxCellState whose tooltip should be returned. |
| node | DOM node that is currently under the mouse. |
| x | X-coordinate of the mouse. |
| y | Y-coordinate of the mouse. |
mxGraph.prototype.getTooltipForCell = function( cell )
Returns the string or DOM node to be used as the tooltip for the given cell. This implementation uses the cells getTooltip function if it exists, or else it returns convertValueToString for the cell.
graph.getTooltipForCell = function(cell)
{
return 'Hello, World!';
}Replaces all tooltips with the string Hello, World!
| cell | mxCell whose tooltip should be returned. |
mxGraph.prototype.getLinkForCell = function( cell )
Returns the string to be used as the link for the given cell. This implementation returns null.
| cell | mxCell whose tooltip should be returned. |
mxGraph.prototype.getCursorForMouseEvent = function( me )
Returns the cursor value to be used for the CSS of the shape for the given event. This implementation calls getCursorForCell.
| me | mxMouseEvent whose cursor should be returned. |
mxGraph.prototype.getCursorForCell = function( cell )
Returns the cursor value to be used for the CSS of the shape for the given cell. This implementation returns null.
| cell | mxCell whose cursor should be returned. |
mxGraph.prototype.getStartSize = function( swimlane )
Returns the start size of the given swimlane, that is, the width or height of the part that contains the title, depending on the horizontal style. The return value is an mxRectangle with either width or height set as appropriate.
| swimlane | mxCell whose start size should be returned. |
mxGraph.prototype.getImage = function( state )
Returns the image URL for the given cell state. This implementation returns the value stored under mxConstants.STYLE_IMAGE in the cell style.
| state | mxCellState whose image URL should be returned. |
mxGraph.prototype.getVerticalAlign = function( state )
Returns the vertical alignment for the given cell state. This implementation returns the value stored under mxConstants.STYLE_VERTICAL_ALIGN in the cell style.
| state | mxCellState whose vertical alignment should be returned. |
mxGraph.prototype.getIndicatorColor = function( state )
Returns the indicator color for the given cell state. This implementation returns the value stored under mxConstants.STYLE_INDICATOR_COLOR in the cell style.
| state | mxCellState whose indicator color should be returned. |
mxGraph.prototype.getIndicatorGradientColor = function( state )
Returns the indicator gradient color for the given cell state. This implementation returns the value stored under mxConstants.STYLE_INDICATOR_GRADIENTCOLOR in the cell style.
| state | mxCellState whose indicator gradient color should be returned. |
mxGraph.prototype.getIndicatorShape = function( state )
Returns the indicator shape for the given cell state. This implementation returns the value stored under mxConstants.STYLE_INDICATOR_SHAPE in the cell style.
| state | mxCellState whose indicator shape should be returned. |
mxGraph.prototype.getIndicatorImage = function( state )
Returns the indicator image for the given cell state. This implementation returns the value stored under mxConstants.STYLE_INDICATOR_IMAGE in the cell style.
| state | mxCellState whose indicator image should be returned. |
mxGraph.prototype.getBorder = function()
Returns the value of border.
mxGraph.prototype.setBorder = function( value )
Sets the value of border.
| value | Positive integer that represents the border to be used. |
mxGraph.prototype.isSwimlane = function ( cell )
Returns true if the given cell is a swimlane in the graph. A swimlane is a container cell with some specific behaviour. This implementation checks if the shape associated with the given cell is a mxSwimlane.
| cell | mxCell to be checked. |
mxGraph.prototype.isResizeContainer = function()
Returns resizeContainer.
mxGraph.prototype.setResizeContainer = function( value )
Sets resizeContainer.
| value | Boolean indicating if the container should be resized. |
mxGraph.prototype.isEnabled = function()
Returns true if the graph is enabled.
mxGraph.prototype.setEnabled = function( value )
Specifies if the graph should allow any interactions. This implementation updates enabled.
| value | Boolean indicating if the graph should be enabled. |
mxGraph.prototype.isEscapeEnabled = function()
Returns escapeEnabled.
mxGraph.prototype.setEscapeEnabled = function( value )
Sets escapeEnabled.
| enabled | Boolean indicating if escape should be enabled. |
mxGraph.prototype.isInvokesStopCellEditing = function()
Returns invokesStopCellEditing.
mxGraph.prototype.setInvokesStopCellEditing = function( value )
Sets invokesStopCellEditing.
mxGraph.prototype.isEnterStopsCellEditing = function()
Returns enterStopsCellEditing.
mxGraph.prototype.setEnterStopsCellEditing = function( value )
Sets enterStopsCellEditing.
mxGraph.prototype.isCellLocked = function( cell )
Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected. This implementation returns true for all vertices with a relative geometry if <locked> is false.
| cell | mxCell whose locked state should be returned. |
mxGraph.prototype.isCellsLocked = function()
Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected. This implementation returns true for all vertices with a relative geometry if <locked> is false.
| cell | mxCell whose locked state should be returned. |
mxGraph.prototype.setCellsLocked = function( value )
Sets if any cell may be moved, sized, bended, disconnected, edited or selected.
| value | Boolean that defines the new value for cellsLocked. |
mxGraph.prototype.isCellCloneable = function( cell )
Returns true if the given cell is cloneable. This implementation returns isCellsCloneable for all cells unless a cell style specifies mxConstants.STYLE_CLONEABLE to be 0.
| cell | Optional mxCell whose cloneable state should be returned. |
mxGraph.prototype.isCellsCloneable = function()
Returns cellsCloneable, that is, if the graph allows cloning of cells by using control-drag.
mxGraph.prototype.setCellsCloneable = function( value )
Specifies if the graph should allow cloning of cells by holding down the control key while cells are being moved. This implementation updates cellsCloneable.
| value | Boolean indicating if the graph should be cloneable. |
mxGraph.prototype.canExportCell = function( cell )
Returns true if the given cell may be exported to the clipboard. This implementation returns exportEnabled for all cells.
| cell | mxCell that represents the cell to be exported. |
mxGraph.prototype.canImportCell = function( cell )
Returns true if the given cell may be imported from the clipboard. This implementation returns importEnabled for all cells.
| cell | mxCell that represents the cell to be imported. |
mxGraph.prototype.isCellSelectable = function( cell )
Returns true if the given cell is selectable. This implementation returns cellsSelectable.
To add a new style for making cells (un)selectable, use the following code.
mxGraph.prototype.isCellSelectable = function(cell)
{
var state = this.view.getState(cell);
var style = (state != null) ? state.style : this.getCellStyle(cell);
return this.isCellsSelectable() && !this.isCellLocked(cell) && style['selectable'] != 0;
};You can then use the new style as shown in this example.
graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30, 'selectable=0');
| cell | mxCell whose selectable state should be returned. |
mxGraph.prototype.isCellsSelectable = function()
Returns cellsSelectable.
mxGraph.prototype.setCellsSelectable = function( value )
Sets cellsSelectable.
mxGraph.prototype.isCellDeletable = function( cell )
Returns true if the given cell is moveable. This returns cellsDeletable for all given cells if a cells style does not specify mxConstants.STYLE_DELETABLE to be 0.
| cell | mxCell whose deletable state should be returned. |
mxGraph.prototype.isCellsDeletable = function()
Returns cellsDeletable.
mxGraph.prototype.setCellsDeletable = function( value )
Sets cellsDeletable.
| value | Boolean indicating if the graph should allow deletion of cells. |
mxGraph.prototype.isLabelMovable = function( cell )
Returns true if the given edges’s label is moveable. This returns <movable> for all given cells if <isLocked> does not return true for the given cell.
| cell | mxCell whose label should be moved. |
mxGraph.prototype.isCellRotatable = function( cell )
Returns true if the given cell is rotatable. This returns true for the given cell if its style does not specify mxConstants.STYLE_ROTATABLE to be 0.
| cell | mxCell whose rotatable state should be returned. |
mxGraph.prototype.isCellMovable = function( cell )
Returns true if the given cell is moveable. This returns cellsMovable for all given cells if isCellLocked does not return true for the given cell and its style does not specify mxConstants.STYLE_MOVABLE to be 0.
| cell | mxCell whose movable state should be returned. |
mxGraph.prototype.isCellsMovable = function()
Returns cellsMovable.
mxGraph.prototype.isGridEnabled = function()
Returns gridEnabled as a boolean.
mxGraph.prototype.isPortsEnabled = function()
Returns portsEnabled as a boolean.
mxGraph.prototype.getGridSize = function()
Returns gridSize.
mxGraph.prototype.setGridSize = function( value )
Sets gridSize.
mxGraph.prototype.getTolerance = function()
Returns tolerance.
mxGraph.prototype.setTolerance = function( value )
Sets tolerance.
mxGraph.prototype.isVertexLabelsMovable = function()
Returns vertexLabelsMovable.
mxGraph.prototype.setVertexLabelsMovable = function( value )
Sets vertexLabelsMovable.
mxGraph.prototype.isEdgeLabelsMovable = function()
Returns edgeLabelsMovable.
Sets edgeLabelsMovable.
mxGraph.prototype.isSwimlaneNesting = function()
Returns swimlaneNesting as a boolean.
mxGraph.prototype.isSwimlaneSelectionEnabled = function()
Returns swimlaneSelectionEnabled as a boolean.
mxGraph.prototype.isMultigraph = function()
Returns multigraph as a boolean.
mxGraph.prototype.isAllowLoops = function()
Returns allowLoops as a boolean.
mxGraph.prototype.isAllowDanglingEdges = function()
Returns allowDanglingEdges as a boolean.
mxGraph.prototype.isConnectableEdges = function()
Returns connectableEdges as a boolean.
mxGraph.prototype.setCloneInvalidEdges = function( value )
Specifies if edges should be inserted when cloned but not valid wrt. getEdgeValidationError. If false such edges will be silently ignored.
| value | Boolean indicating if cloned invalid edges should be inserted into the graph or ignored. |
mxGraph.prototype.isCloneInvalidEdges = function()
Returns cloneInvalidEdges as a boolean.
mxGraph.prototype.isDisconnectOnMove = function()
Returns disconnectOnMove as a boolean.
mxGraph.prototype.isDropEnabled = function()
Returns dropEnabled as a boolean.
mxGraph.prototype.isSplitEnabled = function()
Returns splitEnabled as a boolean.
mxGraph.prototype.isCellResizable = function( cell )
Returns true if the given cell is resizable. This returns cellsResizable for all given cells if isCellLocked does not return true for the given cell and its style does not specify mxConstants.STYLE_RESIZABLE to be 0.
| cell | mxCell whose resizable state should be returned. |
mxGraph.prototype.isCellsResizable = function()
Returns cellsResizable.
mxGraph.prototype.setCellsResizable = function( value )
Specifies if the graph should allow resizing of cells. This implementation updates cellsResizable.
| value | Boolean indicating if the graph should allow resizing of cells. |
mxGraph.prototype.isTerminalPointMovable = function( cell, source )
Returns true if the given terminal point is movable. This is independent from isCellConnectable and isCellDisconnectable and controls if terminal points can be moved in the graph if the edge is not connected. Note that it is required for this to return true to connect unconnected edges. This implementation returns true.
| cell | mxCell whose terminal point should be moved. |
| source | Boolean indicating if the source or target terminal should be moved. |
mxGraph.prototype.isCellBendable = function( cell )
Returns true if the given cell is bendable. This returns cellsBendable for all given cells if <isLocked> does not return true for the given cell and its style does not specify mxConstants.STYLE_BENDABLE to be 0.
| cell | mxCell whose bendable state should be returned. |
mxGraph.prototype.isCellEditable = function( cell )
Returns true if the given cell is editable. This returns cellsEditable for all given cells if isCellLocked does not return true for the given cell and its style does not specify mxConstants.STYLE_EDITABLE to be 0.
| cell | mxCell whose editable state should be returned. |
mxGraph.prototype.isCellsEditable = function()
Returns cellsEditable.
mxGraph.prototype.setCellsEditable = function( value )
Specifies if the graph should allow in-place editing for cell labels. This implementation updates cellsEditable.
| value | Boolean indicating if the graph should allow in-place editing. |
mxGraph.prototype.isCellDisconnectable = function( cell, terminal, source )
Returns true if the given cell is disconnectable from the source or target terminal. This returns isCellsDisconnectable for all given cells if isCellLocked does not return true for the given cell.
| cell | mxCell whose disconnectable state should be returned. |
| terminal | mxCell that represents the source or target terminal. |
| source | Boolean indicating if the source or target terminal is to be disconnected. |
mxGraph.prototype.isCellsDisconnectable = function()
Returns cellsDisconnectable.
mxGraph.prototype.setCellsDisconnectable = function( value )
Sets cellsDisconnectable.
mxGraph.prototype.isValidSource = function( cell )
Returns true if the given cell is a valid source for new connections. This implementation returns true for all non-null values and is called by is called by isValidConnection.
| cell | mxCell that represents a possible source or null. |
mxGraph.prototype.isValidTarget = function( cell )
Returns isValidSource for the given cell. This is called by isValidConnection.
| cell | mxCell that represents a possible target or null. |
mxGraph.prototype.isValidConnection = function( source, target )
Returns true if the given target cell is a valid target for source. This is a boolean implementation for not allowing connections between certain pairs of vertices and is called by getEdgeValidationError. This implementation returns true if isValidSource returns true for the source and isValidTarget returns true for the target.
| source | mxCell that represents the source cell. |
| target | mxCell that represents the target cell. |
mxGraph.prototype.setConnectable = function( connectable )
Specifies if the graph should allow new connections. This implementation updates mxConnectionHandler.enabled in <connectionHandler>.
| connectable | Boolean indicating if new connections should be allowed. |
mxGraph.prototype.setTooltips = function ( enabled )
Specifies if tooltips should be enabled. This implementation updates mxTooltipHandler.enabled in <tooltipHandler>.
| enabled | Boolean indicating if tooltips should be enabled. |
mxGraph.prototype.setPanning = function( enabled )
Specifies if panning should be enabled. This implementation updates mxPanningHandler.panningEnabled in <panningHandler>.
| enabled | Boolean indicating if panning should be enabled. |
mxGraph.prototype.isEditing = function( cell )
Returns true if the given cell is currently being edited. If no cell is specified then this returns true if any cell is currently being edited.
| cell | mxCell that should be checked. |
mxGraph.prototype.isAutoSizeCell = function( cell )
Returns true if the size of the given cell should automatically be updated after a change of the label. This implementation returns autoSizeCells or checks if the cell style does specify mxConstants.STYLE_AUTOSIZE to be 1.
| cell | mxCell that should be resized. |
mxGraph.prototype.isAutoSizeCells = function()
Returns autoSizeCells.
mxGraph.prototype.setAutoSizeCells = function( value )
Specifies if cell sizes should be automatically updated after a label change. This implementation sets autoSizeCells to the given parameter. To update the size of cells when the cells are added, set autoSizeCellsOnAdd to true.
| value | Boolean indicating if cells should be resized automatically. |
mxGraph.prototype.isExtendParent = function( cell )
Returns true if the parent of the given cell should be extended if the child has been resized so that it overlaps the parent. This implementation returns isExtendParents if the cell is not an edge.
| cell | mxCell that has been resized. |
mxGraph.prototype.isExtendParents = function()
Returns extendParents.
mxGraph.prototype.setExtendParents = function( value )
Sets extendParents.
| value | New boolean value for extendParents. |
mxGraph.prototype.isExtendParentsOnAdd = function( cell )
Returns extendParentsOnAdd.
mxGraph.prototype.setExtendParentsOnAdd = function( value )
Sets extendParentsOnAdd.
| value | New boolean value for extendParentsOnAdd. |
mxGraph.prototype.setExtendParentsOnMove = function( value )
Sets <extendParentsOnMove>.
| value | New boolean value for extendParentsOnAdd. |
mxGraph.prototype.isRecursiveResize = function( state )
Returns recursiveResize.
| state | mxCellState that is being resized. |
mxGraph.prototype.setRecursiveResize = function( value )
Sets recursiveResize.
| value | New boolean value for recursiveResize. |
mxGraph.prototype.isConstrainChild = function( cell )
Returns true if the given cell should be kept inside the bounds of its parent according to the rules defined by getOverlap and isAllowOverlapParent. This implementation returns false for all children of edges and isConstrainChildren otherwise.
| cell | mxCell that should be constrained. |
mxGraph.prototype.isConstrainChildren = function()
Returns constrainChildren.
mxGraph.prototype.setConstrainChildren = function( value )
Sets constrainChildren.
mxGraph.prototype.isConstrainRelativeChildren = function()
Returns constrainRelativeChildren.
Returns allowNegativeCoordinates.
Sets allowNegativeCoordinates.
mxGraph.prototype.getOverlap = function( cell )
Returns a decimal number representing the amount of the width and height of the given cell that is allowed to overlap its parent. A value of 0 means all children must stay inside the parent, 1 means the child is allowed to be placed outside of the parent such that it touches one of the parents sides. If isAllowOverlapParent returns false for the given cell, then this method returns 0.
| cell | mxCell for which the overlap ratio should be returned. |
mxGraph.prototype.isAllowOverlapParent = function( cell )
Returns true if the given cell is allowed to be placed outside of the parents area.
| cell | mxCell that represents the child to be checked. |
mxGraph.prototype.isCellFoldable = function( cell, collapse )
Returns true if the given cell is foldable. This implementation returns true if the cell has at least one child and its style does not specify mxConstants.STYLE_FOLDABLE to be 0.
| cell | mxCell whose foldable state should be returned. |
mxGraph.prototype.isValidDropTarget = function( cell, cells, evt )
Returns true if the given cell is a valid drop target for the specified cells. If splitEnabled is true then this returns isSplitTarget for the given arguments else it returns true if the cell is not collapsed and its child count is greater than 0.
| cell | mxCell that represents the possible drop target. |
| cells | mxCells that should be dropped into the target. |
| evt | Mouseevent that triggered the invocation. |
mxGraph.prototype.isSplitTarget = function( target, cells, evt )
Returns true if the given edge may be splitted into two edges with the given cell as a new terminal between the two.
| target | mxCell that represents the edge to be splitted. |
| cells | mxCells that should split the edge. |
| evt | Mouseevent that triggered the invocation. |
mxGraph.prototype.getDropTarget = function( cells, evt, cell, clone )
Returns the given cell if it is a drop target for the given cells or the nearest ancestor that may be used as a drop target for the given cells. If the given array contains a swimlane and swimlaneNesting is false then this always returns null. If no cell is given, then the bottommost swimlane at the location of the given event is returned.
This function should only be used if isDropEnabled returns true.
| cells | Array of mxCells which are to be dropped onto the target. |
| evt | Mouseevent for the drag and drop. |
| cell | mxCell that is under the mousepointer. |
| clone | Optional boolean to indicate of cells will be cloned. |
mxGraph.prototype.getDefaultParent = function()
Returns defaultParent or mxGraphView.currentRoot or the first child child of mxGraphModel.root if both are null. The value returned by this function should be used as the parent for new cells (aka default layer).
mxGraph.prototype.setDefaultParent = function( cell )
Sets the defaultParent to the given cell. Set this to null to return the first child of the root in getDefaultParent.
mxGraph.prototype.getSwimlane = function( cell )
Returns the nearest ancestor of the given cell which is a swimlane, or the given cell, if it is itself a swimlane.
| cell | mxCell for which the ancestor swimlane should be returned. |
mxGraph.prototype.getSwimlaneAt = function ( x, y, parent )
Returns the bottom-most swimlane that intersects the given point (x, y) in the cell hierarchy that starts at the given parent.
| x | X-coordinate of the location to be checked. |
| y | Y-coordinate of the location to be checked. |
| parent | mxCell that should be used as the root of the recursion. Default is defaultParent. |
mxGraph.prototype.getCellAt = function( x, y, parent, vertices, edges, ignoreFn )
Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy starting at the given parent. This will also return swimlanes if the given location intersects the content area of the swimlane. If this is not desired, then the hitsSwimlaneContent may be used if the returned cell is a swimlane to determine if the location is inside the content area or on the actual title of the swimlane.
| x | X-coordinate of the location to be checked. |
| y | Y-coordinate of the location to be checked. |
| parent | mxCell that should be used as the root of the recursion. Default is current root of the view or the root of the model. |
| vertices | Optional boolean indicating if vertices should be returned. Default is true. |
| edges | Optional boolean indicating if edges should be returned. Default is true. |
| ignoreFn | Optional function that returns true if cell should be ignored. The function is passed the cell state and the x and y parameter. |
mxGraph.prototype.intersects = function( state, x, y )
Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy that starts at the given parent.
| state | mxCellState that represents the cell state. |
| x | X-coordinate of the location to be checked. |
| y | Y-coordinate of the location to be checked. |
mxGraph.prototype.hitsSwimlaneContent = function( swimlane, x, y )
Returns true if the given coordinate pair is inside the content are of the given swimlane.
| swimlane | mxCell that specifies the swimlane. |
| x | X-coordinate of the mouse event. |
| y | Y-coordinate of the mouse event. |
mxGraph.prototype.getChildVertices = function( parent )
Returns the visible child vertices of the given parent.
| parent | mxCell whose children should be returned. |
mxGraph.prototype.getChildEdges = function( parent )
Returns the visible child edges of the given parent.
| parent | mxCell whose child vertices should be returned. |
mxGraph.prototype.getChildCells = function( parent, vertices, edges )
Returns the visible child vertices or edges in the given parent. If vertices and edges is false, then all children are returned.
| parent | mxCell whose children should be returned. |
| vertices | Optional boolean that specifies if child vertices should be returned. Default is false. |
| edges | Optional boolean that specifies if child edges should be returned. Default is false. |
mxGraph.prototype.getConnections = function( cell, parent )
Returns all visible edges connected to the given cell without loops.
| cell | mxCell whose connections should be returned. |
| parent | Optional parent of the opposite end for a connection to be returned. |
mxGraph.prototype.getIncomingEdges = function( cell, parent )
Returns the visible incoming edges for the given cell. If the optional parent argument is specified, then only child edges of the given parent are returned.
| cell | mxCell whose incoming edges should be returned. |
| parent | Optional parent of the opposite end for an edge to be returned. |
mxGraph.prototype.getOutgoingEdges = function( cell, parent )
Returns the visible outgoing edges for the given cell. If the optional parent argument is specified, then only child edges of the given parent are returned.
| cell | mxCell whose outgoing edges should be returned. |
| parent | Optional parent of the opposite end for an edge to be returned. |
mxGraph.prototype.getEdges = function( cell, parent, incoming, outgoing, includeLoops, recurse )
Returns the incoming and/or outgoing edges for the given cell. If the optional parent argument is specified, then only edges are returned where the opposite is in the given parent cell. If at least one of incoming or outgoing is true, then loops are ignored, if both are false, then all edges connected to the given cell are returned including loops.
| cell | mxCell whose edges should be returned. |
| parent | Optional parent of the opposite end for an edge to be returned. |
| incoming | Optional boolean that specifies if incoming edges should be included in the result. Default is true. |
| outgoing | Optional boolean that specifies if outgoing edges should be included in the result. Default is true. |
| includeLoops | Optional boolean that specifies if loops should be included in the result. Default is true. |
| recurse | Optional boolean the specifies if the parent specified only need be an ancestral parent, true, or the direct parent, false. Default is false |
mxGraph.prototype.isValidAncestor = function( cell, parent, recurse )
Returns whether or not the specified parent is a valid ancestor of the specified cell, either direct or indirectly based on whether ancestor recursion is enabled.
| cell | mxCell the possible child cell |
| parent | mxCell the possible parent cell |
| recurse | boolean whether or not to recurse the child ancestors |
mxGraph.prototype.getOpposites = function( edges, terminal, sources, targets )
Returns all distinct visible opposite cells for the specified terminal on the given edges.
| edges | Array of mxCells that contains the edges whose opposite terminals should be returned. |
| terminal | Terminal that specifies the end whose opposite should be returned. |
| source | Optional boolean that specifies if source terminals should be included in the result. Default is true. |
| targets | Optional boolean that specifies if targer terminals should be included in the result. Default is true. |
mxGraph.prototype.getPointForEvent = function( evt, addOffset )
Returns an mxPoint representing the given event in the unscaled, non-translated coordinate space of <container> and applies the grid.
| evt | Mousevent that contains the mouse pointer location. |
| addOffset | Optional boolean that specifies if the position should be offset by half of the gridSize. Default is true. |
mxGraph.prototype.getCells = function( x, y, width, height, parent, result )
Returns the child vertices and edges of the given parent that are contained in the given rectangle. The result is added to the optional result array, which is returned. If no result array is specified then a new array is created and returned.
| x | X-coordinate of the rectangle. |
| y | Y-coordinate of the rectangle. |
| width | Width of the rectangle. |
| height | Height of the rectangle. |
| parent | mxCell that should be used as the root of the recursion. Default is current root of the view or the root of the model. |
| result | Optional array to store the result in. |
mxGraph.prototype.getCellsBeyond = function( x0, y0, parent, rightHalfpane, bottomHalfpane )
Returns the children of the given parent that are contained in the halfpane from the given point (x0, y0) rightwards or downwards depending on rightHalfpane and bottomHalfpane.
| x0 | X-coordinate of the origin. |
| y0 | Y-coordinate of the origin. |
| parent | Optional mxCell whose children should be checked. Default is defaultParent. |
| rightHalfpane | Boolean indicating if the cells in the right halfpane from the origin should be returned. |
| bottomHalfpane | Boolean indicating if the cells in the bottom halfpane from the origin should be returned. |
mxGraph.prototype.findTreeRoots = function( parent, isolate, invert )
Returns all children in the given parent which do not have incoming edges. If the result is empty then the with the greatest difference between incoming and outgoing edges is returned.
| parent | mxCell whose children should be checked. |
| isolate | Optional boolean that specifies if edges should be ignored if the opposite end is not a child of the given parent cell. Default is false. |
| invert | Optional boolean that specifies if outgoing or incoming edges should be counted for a tree root. If false then outgoing edges will be counted. Default is false. |
mxGraph.prototype.traverse = function( vertex, directed, func, edge, visited, inverse )
Traverses the (directed) graph invoking the given function for each visited vertex and edge. The function is invoked with the current vertex and the incoming edge as a parameter. This implementation makes sure each vertex is only visited once. The function may return false if the traversal should stop at the given vertex.
mxLog.show();
var cell = graph.getSelectionCell();
graph.traverse(cell, false, function(vertex, edge)
{
mxLog.debug(graph.getLabel(vertex));
});| vertex | mxCell that represents the vertex where the traversal starts. |
| directed | Optional boolean indicating if edges should only be traversed from source to target. Default is true. |
| func | Visitor function that takes the current vertex and the incoming edge as arguments. The traversal stops if the function returns false. |
| edge | Optional mxCell that represents the incoming edge. This is null for the first step of the traversal. |
| visited | Optional mxDictionary from cells to true for the visited cells. |
| inverse | Optional boolean to traverse in inverse direction. Default is false. This is ignored if directed is false. |
mxGraph.prototype.isCellSelected = function( cell )
Returns true if the given cell is selected.
| cell | mxCell for which the selection state should be returned. |
mxGraph.prototype.clearSelection = function()
Clears the selection using mxGraphSelectionModel.clear.
mxGraph.prototype.getSelectionCell = function()
Returns the first cell from the array of selected mxCells.
mxGraph.prototype.getSelectionCells = function()
Returns the array of selected mxCells.
mxGraph.prototype.setSelectionCell = function( cell )
Sets the selection cell.
| cell | mxCell to be selected. |
mxGraph.prototype.setSelectionCells = function( cells )
Sets the selection cell.
| cells | Array of mxCells to be selected. |
mxGraph.prototype.addSelectionCell = function( cell )
Adds the given cell to the selection.
| cell | mxCell to be add to the selection. |
mxGraph.prototype.addSelectionCells = function( cells )
Adds the given cells to the selection.
| cells | Array of mxCells to be added to the selection. |
mxGraph.prototype.removeSelectionCell = function( cell )
Removes the given cell from the selection.
| cell | mxCell to be removed from the selection. |
mxGraph.prototype.removeSelectionCells = function( cells )
Removes the given cells from the selection.
| cells | Array of mxCells to be removed from the selection. |
mxGraph.prototype.selectRegion = function( rect, evt )
Selects and returns the cells inside the given rectangle for the specified event.
| rect | mxRectangle that represents the region to be selected. |
| evt | Mouseevent that triggered the selection. |
mxGraph.prototype.selectCell = function( isNext, isParent, isChild )
Selects the next, parent, first child or previous cell, if all arguments are false.
| isNext | Boolean indicating if the next cell should be selected. |
| isParent | Boolean indicating if the parent cell should be selected. |
| isChild | Boolean indicating if the first child cell should be selected. |
mxGraph.prototype.selectAll = function( parent, descendants )
Selects all children of the given parent cell or the children of the default parent if no parent is specified. To select leaf vertices and/or edges use selectCells.
| parent | Optional mxCell whose children should be selected. Default is defaultParent. |
| descendants | Optional boolean specifying whether all descendants should be selected. Default is false. |
mxGraph.prototype.selectCells = function( vertices, edges, parent )
Selects all vertices and/or edges depending on the given boolean arguments recursively, starting at the given parent or the default parent if no parent is specified. Use selectAll to select all cells. For vertices, only cells with no children are selected.
| vertices | Boolean indicating if vertices should be selected. |
| edges | Boolean indicating if edges should be selected. |
| parent | Optional mxCell that acts as the root of the recursion. Default is defaultParent. |
mxGraph.prototype.selectCellForEvent = function( cell, evt )
Selects the given cell by either adding it to the selection or replacing the selection depending on whether the given mouse event is a toggle event.
| cell | mxCell to be selected. |
| evt | Optional mouseevent that triggered the selection. |
mxGraph.prototype.selectCellsForEvent = function( cells, evt )
Selects the given cells by either adding them to the selection or replacing the selection depending on whether the given mouse event is a toggle event.
| cells | Array of mxCells to be selected. |
| evt | Optional mouseevent that triggered the selection. |
mxGraph.prototype.createHandler = function( state )
Creates a new handler for the given cell state. This implementation returns a new mxEdgeHandler of the corresponding cell is an edge, otherwise it returns an mxVertexHandler.
| state | mxCellState whose handler should be created. |
mxGraph.prototype.createVertexHandler = function( state )
Hooks to create a new mxVertexHandler for the given mxCellState.
| state | mxCellState to create the handler for. |
mxGraph.prototype.createEdgeHandler = function( state, edgeStyle )
Hooks to create a new mxEdgeHandler for the given mxCellState.
| state | mxCellState to create the handler for. |
mxGraph.prototype.createEdgeSegmentHandler = function( state )
Hooks to create a new <mxEdgeSegmentHandler> for the given mxCellState.
| state | mxCellState to create the handler for. |
mxGraph.prototype.createElbowEdgeHandler = function( state )
Hooks to create a new mxElbowEdgeHandler for the given mxCellState.
| state | mxCellState to create the handler for. |
mxGraph.prototype.addMouseListener = function( listener )
Adds a listener to the graph event dispatch loop. The listener must implement the mouseDown, mouseMove and mouseUp methods as shown in the mxMouseEvent class.
| listener | Listener to be added to the graph event listeners. |
mxGraph.prototype.updateMouseEvent = function( me, evtName )
Sets the graphX and graphY properties if the given mxMouseEvent if required and returned the event.
| me | mxMouseEvent to be updated. |
| evtName | Name of the mouse event. |
mxGraph.prototype.isEventIgnored = function( evtName, me, sender )
Returns true if the event should be ignored in fireMouseEvent.
mxGraph.prototype.isEventSourceIgnored = function( evtName, me )
Returns true if the event should be ignored in fireMouseEvent. This implementation returns true for select, option and input (if not of type checkbox, radio, button, submit or file) event sources if the event is not a mouse event or a left mouse button press event.
| evtName | The name of the event. |
| me | mxMouseEvent that should be ignored. |
mxGraph.prototype.getEventState = function( state )
Returns the mxCellState to be used when firing the mouse event for the given state. This implementation returns the given state.
| <mxCellState> | State whose event source should be returned. |
mxGraph.prototype.fireMouseEvent = function( evtName, me, sender )
Dispatches the given event in the graph event dispatch loop. Possible event names are mxEvent.MOUSE_DOWN, mxEvent.MOUSE_MOVE and mxEvent.MOUSE_UP. All listeners are invoked for all events regardless of the consumed state of the event.
| evtName | String that specifies the type of event to be dispatched. |
| me | mxMouseEvent to be fired. |
| sender | Optional sender argument. Default is this. |
mxGraph.prototype.consumeMouseEvent = function( evtName, me, sender )
Consumes the given mxMouseEvent if it’s a touchStart event.
mxGraph.prototype.fireGestureEvent = function( evt, cell )
Dispatches a mxEvent.GESTURE event. The following example will resize the cell under the mouse based on the scale property of the native touch event.
graph.addListener(mxEvent.GESTURE, function(sender, eo)
{
var evt = eo.getProperty('event');
var state = graph.view.getState(eo.getProperty('cell'));
if (graph.isEnabled() && graph.isCellResizable(state.cell) && Math.abs(1 - evt.scale) > 0.2)
{
var scale = graph.view.scale;
var tr = graph.view.translate;
var w = state.width * evt.scale;
var h = state.height * evt.scale;
var x = state.x - (w - state.width) / 2;
var y = state.y - (h - state.height) / 2;
var bounds = new mxRectangle(graph.snap(x / scale) - tr.x,
graph.snap(y / scale) - tr.y, graph.snap(w / scale), graph.snap(h / scale));
graph.resizeCell(state.cell, bounds);
eo.consume();
}
});| evt | Gestureend event that represents the gesture. |
| cell | Optional mxCell associated with the gesture. |
Extends mxEventSource to implement a graph overlay, represented by an icon and a tooltip. Overlays can handle and fire <click> events and are added to the graph using mxGraph.addCellOverlay, and removed using mxGraph.removeCellOverlay, or mxGraph.removeCellOverlays to remove all overlays. The mxGraph.getCellOverlays function returns the array of overlays for a given cell in a graph. If multiple overlays exist for the same cell, then getBounds should be overridden in at least one of the overlays.
Overlays appear on top of all cells in a special layer. If this is not desirable, then the image must be rendered as part of the shape or label of the cell instead.
The following adds a new overlays for a given vertex and selects the cell if the overlay is clicked.
var overlay = new mxCellOverlay(img, html);
graph.addCellOverlay(vertex, overlay);
overlay.addListener(mxEvent.CLICK, function(sender, evt)
{
var cell = evt.getProperty('cell');
graph.setSelectionCell(cell);
});For cell overlays to be printed use mxPrintPreview.printOverlays.
| Events | |
| mxEvent. | Fires when the user clicks on the overlay. |
| Functions | |
| mxCellOverlay | Constructs a new overlay using the given image and tooltip. |
| Variables | |
| image | Holds the mxImage to be used as the icon. |
| tooltip | Holds the optional string to be used as the tooltip. |
| align | Holds the horizontal alignment for the overlay. |
| verticalAlign | Holds the vertical alignment for the overlay. |
| offset | Holds the offset as an mxPoint. |
| cursor | Holds the cursor for the overlay. |
| defaultOverlap | Defines the overlapping for the overlay, that is, the proportional distance from the origin to the point defined by the alignment. |
| Functions | |
| getBounds | Returns the bounds of the overlay for the given mxCellState as an mxRectangle. |
| toString | Returns the textual representation of the overlay to be used as the tooltip. |
function mxCellOverlay( image, tooltip, align, verticalAlign, offset, cursor )
Constructs a new overlay using the given image and tooltip.
| image | mxImage that represents the icon to be displayed. |
| tooltip | Optional string that specifies the tooltip. |
| align | Optional horizontal alignment for the overlay. Possible values are <ALIGN_LEFT>, <ALIGN_CENTER> and <ALIGN_RIGHT> (default). |
| verticalAlign | Vertical alignment for the overlay. Possible values are <ALIGN_TOP>, <ALIGN_MIDDLE> and <ALIGN_BOTTOM> (default). |
mxCellOverlay.prototype.image
Holds the mxImage to be used as the icon.
mxCellOverlay.prototype.align
Holds the horizontal alignment for the overlay. Default is mxConstants.ALIGN_RIGHT. For edges, the overlay always appears in the center of the edge.
mxCellOverlay.prototype.verticalAlign
Holds the vertical alignment for the overlay. Default is mxConstants.ALIGN_BOTTOM. For edges, the overlay always appears in the center of the edge.
mxCellOverlay.prototype.offset
Holds the offset as an mxPoint. The offset will be scaled according to the current scale.
mxCellOverlay.prototype.getBounds = function( state )
Returns the bounds of the overlay for the given mxCellState as an mxRectangle. This should be overridden when using multiple overlays per cell so that the overlays do not overlap.
The following example will place the overlay along an edge (where x=[-1..1] from the start to the end of the edge and y is the orthogonal offset in px).
overlay.getBounds = function(state)
{
var bounds = mxCellOverlay.prototype.getBounds.apply(this, arguments);
if (state.view.graph.getModel().isEdge(state.cell))
{
var pt = state.view.getPoint(state, {x: 0, y: 0, relative: true});
bounds.x = pt.x - bounds.width / 2;
bounds.y = pt.y - bounds.height / 2;
}
return bounds;
};| state | mxCellState that represents the current state of the associated cell. |
mxCellOverlay.prototype.toString = function()
Returns the textual representation of the overlay to be used as the tooltip. This implementation returns tooltip.
Implements an outline (aka overview) for a graph. Set updateOnPan to true to enable updates while the source graph is panning.
var outline = new mxOutline(graph, div);
If an outline is used in an mxWindow in IE8 standards mode, the following code makes sure that the shadow filter is not inherited and that any transparent elements in the graph do not show the page background, but the background of the graph container.
if (document.documentMode == 8)
{
container.style.filter = 'progid:DXImageTransform.Microsoft.alpha(opacity=100)';
}To move the graph to the top, left corner the following code can be used.
var scale = graph.view.scale; var bounds = graph.getGraphBounds(); graph.view.setTranslate(-bounds.x / scale, -bounds.y / scale);
To toggle the suspended mode, the following can be used.
outline.suspended = !outln.suspended;
if (!outline.suspended)
{
outline.update(true);
}| Functions | |
| mxOutline | Constructs a new outline for the specified graph inside the given container. |
| source | Reference to the source mxGraph. |
| outline | Reference to the mxGraph that renders the outline. |
| graphRenderHint | Renderhint to be used for the outline graph. |
| Variables | |
| enabled | Specifies if events are handled. |
| showViewport | Specifies a viewport rectangle should be shown. |
| border | Border to be added at the bottom and right. |
| enabled | Specifies the size of the sizer handler. |
| labelsVisible | Specifies if labels should be visible in the outline. |
| updateOnPan | Specifies if update should be called for mxEvent.PAN in the source graph. |
| sizerImage | Optional mxImage to be used for the sizer. |
| minScale | Minimum scale to be used. |
| suspended | Optional boolean flag to suspend updates. |
| forceVmlHandles | Specifies if VML should be used to render the handles in this control. |
| Functions | |
| createGraph | Creates the mxGraph used in the outline. |
| init | Initializes the outline inside the given container. |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| setZoomEnabled | Enables or disables the zoom handling by showing or hiding the respective handle. |
| refresh | Invokes update and revalidate the outline. |
| createSizer | Creates the shape used as the sizer. |
| getSourceContainerSize | Returns the size of the source container. |
| getOutlineOffset | Returns the offset for drawing the outline graph. |
| getOutlineOffset | Returns the offset for drawing the outline graph. |
| update | Updates the outline. |
| mouseDown | Handles the event by starting a translation or zoom. |
| mouseMove | Handles the event by previewing the viewrect in <graph> and updating the rectangle that represents the viewrect in the outline. |
| getTranslateForEvent | Gets the translate for the given mouse event. |
| mouseUp | Handles the event by applying the translation or zoom to <graph>. |
| destroy | Destroy this outline and removes all listeners from source. |
function mxOutline( source, container )
Constructs a new outline for the specified graph inside the given container.
| source | mxGraph to create the outline for. |
| container | DOM node that will contain the outline. |
Reference to the source mxGraph.
Reference to the mxGraph that renders the outline.
mxOutline.prototype.updateOnPan
Specifies if update should be called for mxEvent.PAN in the source graph. Default is false.
mxOutline.prototype.sizerImage
Optional mxImage to be used for the sizer. Default is null.
mxOutline.prototype.forceVmlHandles
Specifies if VML should be used to render the handles in this control. This is true for IE8 standards mode and false for all other browsers and modes. This is a workaround for rendering issues of HTML elements over elements with filters in IE 8 standards mode.
mxOutline.prototype.createGraph = function( container )
Creates the mxGraph used in the outline.
mxOutline.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxOutline.prototype.setEnabled = function( value )
Enables or disables event handling. This implementation updates enabled.
| value | Boolean that specifies the new enabled state. |
mxOutline.prototype.refresh = function()
Invokes update and revalidate the outline. This method is deprecated.
mxOutline.prototype.getTranslateForEvent = function( me )
Gets the translate for the given mouse event. Here is an example to limit the outline to stay within positive coordinates:
outline.getTranslateForEvent = function(me)
{
var pt = new mxPoint(me.getX() - this.startX, me.getY() - this.startY);
if (!this.zoom)
{
var tr = this.source.view.translate;
pt.x = Math.max(tr.x * this.outline.view.scale, pt.x);
pt.y = Math.max(tr.y * this.outline.view.scale, pt.y);
}
return pt;
};
mxOutline.prototype.destroy = function()
Destroy this outline and removes all listeners from source.
Defines invalid connections along with the error messages that they produce. To add or remove rules on a graph, you must add/remove instances of this class to mxGraph.multiplicities.
graph.multiplicities.push(new mxMultiplicity( true, 'rectangle', null, null, 0, 2, ['circle'], 'Only 2 targets allowed', 'Only circle targets allowed'));
Defines a rule where each rectangle must be connected to no more than 2 circles and no other types of targets are allowed.
| Functions | |
| mxMultiplicity | Instantiate class mxMultiplicity in order to describe allowed connections in a graph. |
| Variables | |
| type | Defines the type of the source or target terminal. |
| attr | Optional string that specifies the attributename to be passed to mxUtils.isNode to check if the rule applies to a cell. |
| value | Optional string that specifies the value of the attribute to be passed to mxUtils.isNode to check if the rule applies to a cell. |
| source | Boolean that specifies if the rule is applied to the source or target terminal of an edge. |
| min | Defines the minimum number of connections for which this rule applies. |
| max | Defines the maximum number of connections for which this rule applies. |
| validNeighbors | Holds an array of strings that specify the type of neighbor for which this rule applies. |
| validNeighborsAllowed | Boolean indicating if the list of validNeighbors are those that are allowed for this rule or those that are not allowed for this rule. |
| countError | Holds the localized error message to be displayed if the number of connections for which the rule applies is smaller than min or greater than max. |
| typeError | Holds the localized error message to be displayed if the type of the neighbor for a connection does not match the rule. |
| Functions | |
| check | Checks the multiplicity for the given arguments and returns the error for the given connection or null if the multiplicity does not apply. |
| checkNeighbors | Checks if there are any valid neighbours in validNeighbors. |
| checkTerminal | Checks the given terminal cell and returns true if this rule applies. |
| checkType | Checks the type of the given value. |
function mxMultiplicity( source, type, attr, value, min, max, validNeighbors, countError, typeError, validNeighborsAllowed )
Instantiate class mxMultiplicity in order to describe allowed connections in a graph. Not all constraints can be enforced while editing, some must be checked at validation time. The countError and typeError are treated as resource keys in mxResources.
| source | Boolean indicating if this rule applies to the source or target terminal. |
| type | Type of the source or target terminal that this rule applies to. See type for more information. |
| attr | Optional attribute name to match the source or target terminal. |
| value | Optional attribute value to match the source or target terminal. |
| min | Minimum number of edges for this rule. Default is 1. |
| max | Maximum number of edges for this rule. n means infinite. Default is n. |
| validNeighbors | Array of types of the opposite terminal for which this rule applies. |
| countError | Error to be displayed for invalid number of edges. |
| typeError | Error to be displayed for invalid opposite terminals. |
| validNeighborsAllowed | Optional boolean indicating if the array of opposite types should be valid or invalid. |
mxMultiplicity.prototype.type
Defines the type of the source or target terminal. The type is a string passed to mxUtils.isNode together with the source or target vertex value as the first argument.
mxMultiplicity.prototype.attr
Optional string that specifies the attributename to be passed to mxUtils.isNode to check if the rule applies to a cell.
mxMultiplicity.prototype.value
Optional string that specifies the value of the attribute to be passed to mxUtils.isNode to check if the rule applies to a cell.
mxMultiplicity.prototype.check = function( graph, edge, source, target, sourceOut, targetIn )
Checks the multiplicity for the given arguments and returns the error for the given connection or null if the multiplicity does not apply.
| graph | Reference to the enclosing mxGraph instance. |
| edge | mxCell that represents the edge to validate. |
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
| sourceOut | Number of outgoing edges from the source terminal. |
| targetIn | Number of incoming edges for the target terminal. |
mxMultiplicity.prototype.checkNeighbors = function( graph, edge, source, target )
Checks if there are any valid neighbours in validNeighbors. This is only called if validNeighbors is a non-empty array.
var layoutMgr = new mxLayoutManager(graph);
layoutMgr.getLayout = function(cell)
{
return layout;
};| Events | |
| mxEvent. | Fires between begin- and endUpdate after all cells have been layouted in layoutCells. |
| Functions | |
| mxLayoutManager | Constructs a new automatic layout for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| bubbling | Specifies if the layout should bubble along the cell hierarchy. |
| enabled | Specifies if event handling is enabled. |
| updateHandler | Holds the function that handles the endUpdate event. |
| moveHandler | Holds the function that handles the move event. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isBubbling | Returns true if a layout should bubble, that is, if the parent layout should be executed whenever a cell layout (layout of the children of a cell) has been executed. |
| setBubbling | Sets bubbling. |
| getGraph | Returns the graph that this layout operates on. |
| setGraph | Sets the graph that the layouts operate on. |
| getLayout | Returns the layout to be executed for the given graph and parent. |
| beforeUndo | Called from the undoHandler. |
| executeLayout | Executes the given layout on the given parent. |
| cellsMoved | Called from the moveHandler. |
| getCellsForEdit | Returns the cells to be layouted for the given sequence of changes. |
| getCellsForChange | Executes all layouts which have been scheduled during the changes. |
| layoutCells | Executes all layouts which have been scheduled during the changes. |
| executeLayout | Executes the given layout on the given parent. |
| destroy | Removes all handlers from the graph and deletes the reference to it. |
Fires between begin- and endUpdate after all cells have been layouted in layoutCells. The <code>cells</code> property contains all cells that have been passed to layoutCells.
mxLayoutManager.prototype.graph
Reference to the enclosing mxGraph.
mxLayoutManager.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxLayoutManager.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
| enabled | Boolean that specifies the new enabled state. |
mxLayoutManager.prototype.isBubbling = function()
Returns true if a layout should bubble, that is, if the parent layout should be executed whenever a cell layout (layout of the children of a cell) has been executed. This implementation returns bubbling.
mxLayoutManager.prototype.setBubbling = function( value )
Sets bubbling.
mxLayoutManager.prototype.beforeUndo = function( undoableEdit )
Called from the undoHandler.
| cell | Array of mxCells that have been moved. |
| evt | Mouse event that represents the mousedown. |
mxLayoutManager.prototype.cellsMoved = function( cells, evt )
Called from the moveHandler.
| cell | Array of mxCells that have been moved. |
| evt | Mouse event that represents the mousedown. |
mxLayoutManager.prototype.destroy = function()
Removes all handlers from the graph and deletes the reference to it.
Manager for swimlanes and nested swimlanes that sets the size of newly added swimlanes to that of their siblings, and propagates changes to the size of a swimlane to its siblings, if <siblings> is true, and its ancestors, if <bubbling> is true.
| Functions | |
| mxSwimlaneManager | Constructs a new swimlane manager for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if event handling is enabled. |
| horizontal | Specifies the orientation of the swimlanes. |
| addEnabled | Specifies if newly added cells should be resized to match the size of their existing siblings. |
| resizeEnabled | Specifies if resizing of swimlanes should be handled. |
| moveHandler | Holds the function that handles the move event. |
| moveHandler | Holds the function that handles the move event. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isHorizontal | Returns horizontal. |
| setHorizontal | Sets horizontal. |
| isAddEnabled | Returns addEnabled. |
| setAddEnabled | Sets addEnabled. |
| isResizeEnabled | Returns resizeEnabled. |
| setResizeEnabled | Sets resizeEnabled. |
| getGraph | Returns the graph that this manager operates on. |
| setGraph | Sets the graph that the manager operates on. |
| isSwimlaneIgnored | Returns true if the given swimlane should be ignored. |
| isCellHorizontal | Returns true if the given cell is horizontal. |
| cellsAdded | Called if any cells have been added. |
| swimlaneAdded | Updates the size of the given swimlane to match that of any existing siblings swimlanes. |
| cellsResized | Called if any cells have been resizes. |
| resizeSwimlane | Called from cellsResized for all swimlanes that are not ignored to update the size of the siblings and the size of the parent swimlanes, recursively, if <bubbling> is true. |
| destroy | Removes all handlers from the graph and deletes the reference to it. |
mxSwimlaneManager.prototype.graph
Reference to the enclosing mxGraph.
mxSwimlaneManager.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxSwimlaneManager.prototype.setEnabled = function( value )
Enables or disables event handling. This implementation updates enabled.
| enabled | Boolean that specifies the new enabled state. |
mxSwimlaneManager.prototype.isHorizontal = function()
Returns horizontal.
mxSwimlaneManager.prototype.setHorizontal = function( value )
Sets horizontal.
mxSwimlaneManager.prototype.isAddEnabled = function()
Returns addEnabled.
mxSwimlaneManager.prototype.setAddEnabled = function( value )
Sets addEnabled.
mxSwimlaneManager.prototype.isResizeEnabled = function()
Returns resizeEnabled.
mxSwimlaneManager.prototype.setResizeEnabled = function( value )
Sets resizeEnabled.
mxSwimlaneManager.prototype.cellsAdded = function( cells )
Called if any cells have been added.
| cell | Array of mxCells that have been added. |
mxSwimlaneManager.prototype.swimlaneAdded = function( swimlane )
Updates the size of the given swimlane to match that of any existing siblings swimlanes.
| swimlane | mxCell that represents the new swimlane. |
mxSwimlaneManager.prototype.cellsResized = function( cells )
Called if any cells have been resizes. Calls <swimlaneResized> for all swimlanes where isSwimlaneIgnored returns false.
| cells | Array of mxCells whose size was changed. |
mxSwimlaneManager.prototype.resizeSwimlane = function( swimlane, w, h, parentHorizontal )
Called from cellsResized for all swimlanes that are not ignored to update the size of the siblings and the size of the parent swimlanes, recursively, if <bubbling> is true.
| swimlane | mxCell whose size has changed. |
mxSwimlaneManager.prototype.destroy = function()
Removes all handlers from the graph and deletes the reference to it.
mxTemporaryCellStates.prototype.destroy = function()
Returns the top, left corner as a new mxPoint.
Implements a live preview for moving cells.
| Functions | |
| mxCellStatePreview | Constructs a move preview for the given graph. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| deltas | Reference to the enclosing mxGraph. |
| count | Contains the number of entries in the map. |
| Functions | |
| isEmpty | Returns true if this contains no entries. |
| moveState | |
| show | |
| translateState | |
| revalidateState | |
| addEdges |
function mxCellStatePreview( graph )
Constructs a move preview for the given graph.
| graph | Reference to the enclosing mxGraph. |
mxCellStatePreview.prototype.graph
Reference to the enclosing mxGraph.
mxCellStatePreview.prototype.deltas
Reference to the enclosing mxGraph.
Defines an object that contains the constraints about how to connect one side of an edge to its terminal.
| Functions | |
| mxConnectionConstraint | Constructs a new connection constraint for the given point and boolean arguments. |
| Variables | |
| point | mxPoint that specifies the fixed location of the connection point. |
| perimeter | Boolean that specifies if the point should be projected onto the perimeter of the terminal. |
| name | Optional string that specifies the name of the constraint. |
| dx | Optional float that specifies the horizontal offset of the constraint. |
| dy | Optional float that specifies the vertical offset of the constraint. |
function mxConnectionConstraint( point, perimeter, name, dx, dy )
Constructs a new connection constraint for the given point and boolean arguments.
| point | Optional mxPoint that specifies the fixed location of the point in relative coordinates. Default is null. |
| perimeter | Optional boolean that specifies if the fixed point should be projected onto the perimeter of the terminal. Default is true. |
mxConnectionConstraint.prototype.point
mxPoint that specifies the fixed location of the connection point.
Graph event handler that handles selection. Individual cells are handled separately using mxVertexHandler or one of the edge handlers. These handlers are created using mxGraph.createHandler in mxGraphSelectionModel.cellAdded.
To avoid the container to scroll a moved cell into view, set <scrollAfterMove> to false.
| Functions | |
| mxGraphHandler | Constructs an event handler that creates handles for the selection cells. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| maxCells | Defines the maximum number of cells to paint subhandles for. |
| enabled | Specifies if events are handled. |
| highlightEnabled | Specifies if drop targets under the mouse should be enabled. |
| cloneEnabled | Specifies if cloning by control-drag is enabled. |
| moveEnabled | Specifies if moving is enabled. |
| guidesEnabled | Specifies if other cells should be used for snapping the right, center or left side of the current selection. |
| guide | Holds the mxGuide instance that is used for alignment. |
| currentDx | Stores the x-coordinate of the current mouse move. |
| currentDy | Stores the y-coordinate of the current mouse move. |
| updateCursor | Specifies if a move cursor should be shown if the mouse is over a movable cell. |
| selectEnabled | Specifies if selecting is enabled. |
| removeCellsFromParent | Specifies if cells may be moved out of their parents. |
| removeEmptyParents | If empty parents should be removed from the model after all child cells have been moved out. |
| connectOnDrop | Specifies if drop events are interpreted as new connections if no other drop action is defined. |
| scrollOnMove | Specifies if the view should be scrolled so that a moved cell is visible. |
| minimumSize | Specifies the minimum number of pixels for the width and height of a selection border. |
| previewColor | Specifies the color of the preview shape. |
| htmlPreview | Specifies if the graph container should be used for preview. |
| shape | Reference to the mxShape that represents the preview. |
| scaleGrid | Specifies if the grid should be scaled. |
| rotationEnabled | Specifies if the bounding box should allow for rotation. |
| Functions | |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| isCloneEnabled | Returns cloneEnabled. |
| setCloneEnabled | Sets cloneEnabled. |
| isMoveEnabled | Returns moveEnabled. |
| setMoveEnabled | Sets moveEnabled. |
| isSelectEnabled | Returns selectEnabled. |
| setSelectEnabled | Sets selectEnabled. |
| isRemoveCellsFromParent | Returns removeCellsFromParent. |
| setRemoveCellsFromParent | Sets removeCellsFromParent. |
| getInitialCellForEvent | Hook to return initial cell for the given event. |
| isDelayedSelection | Hook to return true for delayed selections. |
| consumeMouseEvent | Consumes the given mouse event. |
| mouseDown | Handles the event by selecing the given cell and creating a handle for it. |
| getGuideStates | Creates an array of cell states which should be used as guides. |
| getCells | Returns the cells to be modified by this handler. |
| getPreviewBounds | Returns the mxRectangle used as the preview bounds for moving the given cells. |
| getBoundingBox | Returns the union of the mxCellStates for the given array of mxCells. |
| createPreviewShape | Creates the shape used to draw the preview for the given bounds. |
| start | Starts the handling of the mouse gesture. |
| useGuidesForEvent | Returns true if the guides should be used for the given mxMouseEvent. |
| snap | Snaps the given vector to the grid and returns the given mxPoint instance. |
| getDelta | Returns an mxPoint that represents the vector for moving the cells for the given mxMouseEvent. |
| updateHint | Hook for subclassers do show details while the handler is active. |
| removeHint | Hooks for subclassers to hide details when the handler gets inactive. |
| roundLength | Hook for rounding the unscaled vector. |
| mouseMove | Handles the event by highlighting possible drop targets and updating the preview. |
| updatePreviewShape | Updates the bounds of the preview shape. |
| setHighlightColor | Sets the color of the rectangle used to highlight drop targets. |
| mouseUp | Handles the event by applying the changes to the selection cells. |
| selectDelayed | Implements the delayed selection for the given mouse event. |
| reset | Resets the state of this handler. |
| shouldRemoveCellsFromParent | Returns true if the given cells should be removed from the parent for the specified mousereleased event. |
| moveCells | Moves the given cells by the specified amount. |
| moveCells | Moves the given cells by the specified amount. |
| destroyShapes | Destroy the preview and highlight shapes. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
function mxGraphHandler( graph )
Constructs an event handler that creates handles for the selection cells.
| graph | Reference to the enclosing mxGraph. |
mxGraphHandler.prototype.graph
Reference to the enclosing mxGraph.
mxGraphHandler.prototype.maxCells
Defines the maximum number of cells to paint subhandles for. Default is 50 for Firefox and 20 for IE. Set this to 0 if you want an unlimited number of handles to be displayed. This is only recommended if the number of cells in the graph is limited to a small number, eg. 500.
mxGraphHandler.prototype.guide
Holds the mxGuide instance that is used for alignment.
mxGraphHandler.prototype.htmlPreview
Specifies if the graph container should be used for preview. If this is used then drop target detection relies entirely on mxGraph.getCellAt because the HTML preview does not “let events through”. Default is false.
mxGraphHandler.prototype.shape
Reference to the mxShape that represents the preview.
mxGraphHandler.prototype.isEnabled = function()
Returns enabled.
mxGraphHandler.prototype.setEnabled = function( value )
Sets enabled.
mxGraphHandler.prototype.isCloneEnabled = function()
Returns cloneEnabled.
mxGraphHandler.prototype.setCloneEnabled = function( value )
Sets cloneEnabled.
| value | Boolean that specifies the new clone enabled state. |
mxGraphHandler.prototype.isMoveEnabled = function()
Returns moveEnabled.
mxGraphHandler.prototype.setMoveEnabled = function( value )
Sets moveEnabled.
mxGraphHandler.prototype.isSelectEnabled = function()
Returns selectEnabled.
mxGraphHandler.prototype.setSelectEnabled = function( value )
Sets selectEnabled.
mxGraphHandler.prototype.isRemoveCellsFromParent = function()
Returns removeCellsFromParent.
mxGraphHandler.prototype.setRemoveCellsFromParent = function( value )
Sets removeCellsFromParent.
mxGraphHandler.prototype.consumeMouseEvent = function( evtName, me )
Consumes the given mouse event. NOTE: This may be used to enable click events for links in labels on iOS as follows as consuming the initial touchStart disables firing the subsequent click event on the link.
<code> mxGraphHandler.prototype.consumeMouseEvent = function(evtName, me) { var source = mxEvent.getSource(me.getEvent());
if (!mxEvent.isTouchEvent(me.getEvent()) || source.nodeName != ‘A’) { me.consume(); } } </code>
mxGraphHandler.prototype.getCells = function( initialCell )
Returns the cells to be modified by this handler. This implementation returns all selection cells that are movable, or the given initial cell if the given cell is not selected and movable. This handles the case of moving unselectable or unselected cells.
| initialCell | mxCell that triggered this handler. |
mxGraphHandler.prototype.getPreviewBounds = function( cells )
Returns the mxRectangle used as the preview bounds for moving the given cells.
mxGraphHandler.prototype.getBoundingBox = function( cells )
Returns the union of the mxCellStates for the given array of mxCells. For vertices, this method uses the bounding box of the corresponding shape if one exists. The bounding box of the corresponding text label and all controls and overlays are ignored. See also: mxGraphView.getBounds and mxGraph.getBoundingBox.
| cells | Array of mxCells whose bounding box should be returned. |
mxGraphHandler.prototype.useGuidesForEvent = function( me )
Returns true if the guides should be used for the given mxMouseEvent. This implementation returns mxGuide.isEnabledForEvent.
mxGraphHandler.prototype.getDelta = function( me )
Returns an mxPoint that represents the vector for moving the cells for the given mxMouseEvent.
Event handler that pans and creates popupmenus. To use the left mousebutton for panning without interfering with cell moving and resizing, use <isUseLeftButton> and <isIgnoreCell>. For grid size steps while panning, use useGrid. This handler is built-into <mxGraph.panningHandler> and enabled using mxGraph.setPanning.
| Functions | |
| mxPanningHandler | Constructs an event handler that creates a mxPopupMenu and pans the graph. |
| Events | |
| mxEvent. | Fires when the panning handler changes its <active> state to true. |
| mxEvent.PAN | Fires while handle is processing events. |
| mxEvent. | Fires when the panning handler changes its <active> state to false. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| useLeftButtonForPanning | Specifies if panning should be active for the left mouse button. |
| usePopupTrigger | Specifies if mxEvent.isPopupTrigger should also be used for panning. |
| ignoreCell | Specifies if panning should be active even if there is a cell under the mousepointer. |
| previewEnabled | Specifies if the panning should be previewed. |
| useGrid | Specifies if the panning steps should be aligned to the grid size. |
| panningEnabled | Specifies if panning should be enabled. |
| pinchEnabled | Specifies if pinch gestures should be handled as zoom. |
| maxScale | Specifies the maximum scale. |
| minScale | Specifies the minimum scale. |
| dx | Holds the current horizontal offset. |
| dy | Holds the current vertical offset. |
| startX | Holds the x-coordinate of the start point. |
| startY | Holds the y-coordinate of the start point. |
| Functions | |
| isActive | Returns true if the handler is currently active. |
| isPanningEnabled | Returns panningEnabled. |
| setPanningEnabled | Sets panningEnabled. |
| isPinchEnabled | Returns pinchEnabled. |
| setPinchEnabled | Sets pinchEnabled. |
| isPanningTrigger | Returns true if the given event is a panning trigger for the optional given cell. |
| isForcePanningEvent | Returns true if the given mxMouseEvent should start panning. |
| mouseDown | Handles the event by initiating the panning. |
| start | Starts panning at the given event. |
| consumePanningTrigger | Consumes the given mxMouseEvent if it was a panning trigger in mouseDown. |
| mouseMove | Handles the event by updating the panning on the graph. |
| mouseUp | Handles the event by setting the translation on the view or showing the popupmenu. |
| mouseUp | Handles the event by setting the translation on the view or showing the popupmenu. |
| panGraph | Pans graph by the given amount. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
Constructs an event handler that creates a mxPopupMenu and pans the graph.
Fires when the panning handler changes its <active> state to true. The <code>event</code> property contains the corresponding mxMouseEvent.
Fires while handle is processing events. The <code>event</code> property contains the corresponding mxMouseEvent.
Fires when the panning handler changes its <active> state to false. The <code>event</code> property contains the corresponding mxMouseEvent.
mxPanningHandler.prototype.graph
Reference to the enclosing mxGraph.
mxPanningHandler.prototype.useLeftButtonForPanning
Specifies if panning should be active for the left mouse button. Setting this to true may conflict with mxRubberband. Default is false.
mxPanningHandler.prototype.usePopupTrigger
Specifies if mxEvent.isPopupTrigger should also be used for panning.
mxPanningHandler.prototype.isPanningEnabled = function()
Returns panningEnabled.
mxPanningHandler.prototype.setPanningEnabled = function( value )
Sets panningEnabled.
mxPanningHandler.prototype.isPinchEnabled = function()
Returns pinchEnabled.
mxPanningHandler.prototype.setPinchEnabled = function( value )
Sets pinchEnabled.
mxPanningHandler.prototype.isPanningTrigger = function( me )
Returns true if the given event is a panning trigger for the optional given cell. This returns true if control-shift is pressed or if usePopupTrigger is true and the event is a popup trigger.
mxPanningHandler.prototype.isForcePanningEvent = function( me )
Returns true if the given mxMouseEvent should start panning. This implementation always returns true if ignoreCell is true or for multi touch events.
mxPanningHandler.prototype.consumePanningTrigger = function( me )
Consumes the given mxMouseEvent if it was a panning trigger in mouseDown. The default is to invoke mxMouseEvent.consume. Note that this will block any further event processing. If you haven’t disabled built-in context menus and require immediate selection of the cell on mouseDown in Safari and/or on the Mac, then use the following code:
mxPanningHandler.prototype.consumePanningTrigger = function(me)
{
if (me.evt.preventDefault)
{
me.evt.preventDefault();
}
// Stops event processing in IE
me.evt.returnValue = false;
// Sets local consumed state
if (!mxClient.IS_SF && !mxClient.IS_MAC)
{
me.consumed = true;
}
};
mxPanningHandler.prototype.panGraph = function( dx, dy )
Pans graph by the given amount.
Event handler that creates popupmenus.
| Functions | |
| mxPopupMenuHandler | Constructs an event handler that creates a mxPopupMenu. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| selectOnPopup | Specifies if cells should be selected if a popupmenu is displayed for them. |
| clearSelectionOnBackground | Specifies if cells should be deselected if a popupmenu is displayed for the diagram background. |
| triggerX | X-coordinate of the mouse down event. |
| triggerY | Y-coordinate of the mouse down event. |
| screenX | Screen X-coordinate of the mouse down event. |
| screenY | Screen Y-coordinate of the mouse down event. |
| Functions | |
| init | Initializes the shapes required for this vertex handler. |
| isSelectOnPopup | Hook for returning if a cell should be selected for a given mxMouseEvent. |
| mouseDown | Handles the event by initiating the panning. |
| mouseMove | Handles the event by updating the panning on the graph. |
| mouseUp | Handles the event by setting the translation on the view or showing the popupmenu. |
| getCellForPopupEvent | Hook to return the cell for the mouse up popup trigger handling. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
function mxPopupMenuHandler( graph, factoryMethod )
Constructs an event handler that creates a mxPopupMenu.
mxPopupMenuHandler.prototype.graph
Reference to the enclosing mxGraph.
mxPopupMenuHandler.prototype.isSelectOnPopup = function( me )
Hook for returning if a cell should be selected for a given mxMouseEvent. This implementation returns selectOnPopup.
A helper class to process mouse locations and highlight cells.
Helper class to highlight cells. To add a cell marker to an existing graph for highlighting all cells, the following code is used:
var marker = new mxCellMarker(graph);
graph.addMouseListener({
mouseDown: function() {},
mouseMove: function(sender, me)
{
marker.process(me);
},
mouseUp: function() {}
});| Events | |
| mxEvent.MARK | Fires after a cell has been marked or unmarked. |
| Functions | |
| mxCellMarker | Constructs a new cell marker. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if the marker is enabled. |
| hotspot | Specifies the portion of the width and height that should trigger a highlight. |
| hotspotEnabled | Specifies if the hotspot is enabled. |
| validColor | Holds the valid marker color. |
| invalidColor | Holds the invalid marker color. |
| currentColor | Holds the current marker color. |
| validState | Holds the marked mxCellState if it is valid. |
| markedState | Holds the marked mxCellState. |
| Functions | |
| setEnabled | Enables or disables event handling. |
| isEnabled | Returns true if events are handled. |
| setHotspot | Sets the hotspot. |
| getHotspot | Returns the hotspot. |
| setHotspotEnabled | Specifies whether the hotspot should be used in intersects. |
| isHotspotEnabled | Returns true if hotspot is used in intersects. |
| hasValidState | Returns true if validState is not null. |
| getValidState | Returns the validState. |
| getMarkedState | Returns the markedState. |
| reset | Resets the state of the cell marker. |
| process | Processes the given event and cell and marks the state returned by getState with the color returned by getMarkerColor. |
| setCurrentState | Sets and marks the current valid state. |
| markCell | Marks the given cell using the given color, or validColor if no color is specified. |
| mark | Marks the markedState and fires a mark event. |
| unmark | Hides the marker and fires a mark event. |
| isValidState | Returns true if the given mxCellState is a valid state. |
| getMarkerColor | Returns the valid- or invalidColor depending on the value of isValid. |
| getState | Uses getCell, getStateToMark and intersects to return the mxCellState for the given mxMouseEvent. |
| getCell | Returns the mxCell for the given event and cell. |
| getStateToMark | Returns the mxCellState to be marked for the given mxCellState under the mouse. |
| intersects | Returns true if the given coordinate pair intersects the given state. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
Fires after a cell has been marked or unmarked. The <code>state</code> property contains the marked mxCellState or null if no state is marked.
function mxCellMarker( graph, validColor, invalidColor, hotspot )
Constructs a new cell marker.
| graph | Reference to the enclosing mxGraph. |
| validColor | Optional marker color for valid states. Default is mxConstants.DEFAULT_VALID_COLOR. |
| invalidColor | Optional marker color for invalid states. Default is mxConstants.DEFAULT_INVALID_COLOR. |
| hotspot | Portion of the width and hight where a state intersects a given coordinate pair. A value of 0 means always highlight. Default is mxConstants.DEFAULT_HOTSPOT. |
mxCellMarker.prototype.graph
Reference to the enclosing mxGraph.
mxCellMarker.prototype.validState
Holds the marked mxCellState if it is valid.
mxCellMarker.prototype.markedState
Holds the marked mxCellState.
mxCellMarker.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
| enabled | Boolean that specifies the new enabled state. |
mxCellMarker.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxCellMarker.prototype.setHotspot = function( hotspot )
Sets the hotspot.
mxCellMarker.prototype.getHotspot = function()
Returns the hotspot.
mxCellMarker.prototype.setHotspotEnabled = function( enabled )
Specifies whether the hotspot should be used in intersects.
mxCellMarker.prototype.isHotspotEnabled = function()
Returns true if hotspot is used in intersects.
mxCellMarker.prototype.hasValidState = function()
Returns true if validState is not null.
mxCellMarker.prototype.getValidState = function()
Returns the validState.
mxCellMarker.prototype.getMarkedState = function()
Returns the markedState.
mxCellMarker.prototype.process = function( me )
Processes the given event and cell and marks the state returned by getState with the color returned by getMarkerColor. If the markerColor is not null, then the state is stored in markedState. If isValidState returns true, then the state is stored in validState regardless of the marker color. The state is returned regardless of the marker color and valid state.
mxCellMarker.prototype.markCell = function( cell, color )
Marks the given cell using the given color, or validColor if no color is specified.
mxCellMarker.prototype.mark = function()
Marks the markedState and fires a mark event.
mxCellMarker.prototype.unmark = function()
Hides the marker and fires a mark event.
mxCellMarker.prototype.isValidState = function( state )
Returns true if the given mxCellState is a valid state. If this returns true, then the state is stored in validState. The return value of this method is used as the argument for getMarkerColor.
mxCellMarker.prototype.getMarkerColor = function( evt, state, isValid )
Returns the valid- or invalidColor depending on the value of isValid. The given mxCellState is ignored by this implementation.
mxCellMarker.prototype.getState = function( me )
Uses getCell, getStateToMark and intersects to return the mxCellState for the given mxMouseEvent.
mxCellMarker.prototype.getCell = function( me )
Returns the mxCell for the given event and cell. This returns the given cell.
mxCellMarker.prototype.getStateToMark = function( state )
Returns the mxCellState to be marked for the given mxCellState under the mouse. This returns the given state.
mxCellMarker.prototype.intersects = function( state, me )
Returns true if the given coordinate pair intersects the given state. This returns true if the hotspot is 0 or the coordinates are inside the hotspot for the given cell state.
An event handler that manages cell handlers and invokes their mouse event processing functions.
| Events | |
| mxEvent.ADD | Fires if a cell has been added to the selection. |
| mxEvent. | Fires if a cell has been remove from the selection. |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if events are handled. |
| refreshHandler | Keeps a reference to an event listener for later removal. |
| maxHandlers | Defines the maximum number of handlers to paint individually. |
| handlers | mxDictionary that maps from cells to handlers. |
| isEnabled | Returns enabled. |
| setEnabled | Sets enabled. |
| getHandler | Returns the handler for the given cell. |
| reset | Resets all handlers. |
| refresh | Reloads or updates all handlers. |
| isHandlerActive | Returns true if the given handler is active and should not be redrawn. |
| updateHandler | Updates the handler for the given shape if one exists. |
| mouseDown | Redirects the given event to the handlers. |
| mouseMove | Redirects the given event to the handlers. |
| mouseUp | Redirects the given event to the handlers. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
Fires if a cell has been added to the selection. The <code>state</code> property contains the mxCellState that has been added.
Fires if a cell has been remove from the selection. The <code>state</code> property contains the mxCellState that has been removed.
| graph | Reference to the enclosing mxGraph. |
mxSelectionCellsHandler.prototype.graph
Reference to the enclosing mxGraph.
mxSelectionCellsHandler.prototype.handlers
mxDictionary that maps from cells to handlers.
mxSelectionCellsHandler.prototype.isEnabled = function()
Returns enabled.
mxSelectionCellsHandler.prototype.setEnabled = function( value )
Sets enabled.
Graph event handler that creates new connections. Uses <mxTerminalMarker> for finding and highlighting the source and target vertices and factoryMethod to create the edge instance. This handler is built-into <mxGraph.connectionHandler> and enabled using mxGraph.setConnectable.
new mxConnectionHandler(graph, function(source, target, style)
{
edge = new mxCell('', new mxGeometry());
edge.setEdge(true);
edge.setStyle(style);
edge.geometry.relative = true;
return edge;
});Here is an alternative solution that just sets a specific user object for new edges by overriding insertEdge.
mxConnectionHandlerInsertEdge = mxConnectionHandler.prototype.insertEdge;
mxConnectionHandler.prototype.insertEdge = function(parent, id, value, source, target, style)
{
value = 'Test';
return mxConnectionHandlerInsertEdge.apply(this, arguments);
};This handler uses mxTerminalMarker to find the source and target cell for the new connection and creates a new edge using connect. The new edge is created using createEdge which in turn uses factoryMethod or creates a new default edge.
The handler uses a “highlight-paradigm” for indicating if a cell is being used as a source or target terminal, as seen in other diagramming products. In order to allow both, moving and connecting cells at the same time, mxConstants.DEFAULT_HOTSPOT is used in the handler to determine the hotspot of a cell, that is, the region of the cell which is used to trigger a new connection. The constant is a value between 0 and 1 that specifies the amount of the width and height around the center to be used for the hotspot of a cell and its default value is 0.5. In addition, mxConstants.MIN_HOTSPOT_SIZE defines the minimum number of pixels for the width and height of the hotspot.
This solution, while standards compliant, may be somewhat confusing because there is no visual indicator for the hotspot and the highlight is seen to switch on and off while the mouse is being moved in and out. Furthermore, this paradigm does not allow to create different connections depending on the highlighted hotspot as there is only one hotspot per cell and it normally does not allow cells to be moved and connected at the same time as there is no clear indication of the connectable area of the cell.
To come across these issues, the handle has an additional createIcons hook with a default implementation that allows to create one icon to be used to trigger new connections. If this icon is specified, then new connections can only be created if the image is clicked while the cell is being highlighted. The createIcons hook may be overridden to create more than one mxImageShape for creating new connections, but the default implementation supports one image and is used as follows:
In order to display the “connect image” whenever the mouse is over the cell, an DEFAULT_HOTSPOT of 1 should be used:
mxConstants.DEFAULT_HOTSPOT = 1;
In order to avoid confusion with the highlighting, the highlight color should not be used with a connect image:
mxConstants.HIGHLIGHT_COLOR = null;
To install the image, the connectImage field of the mxConnectionHandler must be assigned a new mxImage instance:
mxConnectionHandler.prototype.connectImage = new mxImage('images/green-dot.gif', 14, 14);This will use the green-dot.gif with a width and height of 14 pixels as the image to trigger new connections. In createIcons the icon field of the handler will be set in order to remember the icon that has been clicked for creating the new connection. This field will be available under selectedIcon in the connect method, which may be overridden to take the icon that triggered the new connection into account. This is useful if more than one icon may be used to create a connection.
| Events | |
| mxEvent. | Fires when a new connection is being created by the user. |
| mxEvent. | Fires between begin- and endUpdate in connect. |
| mxEvent. | Fires when the reset method is invoked. |
| mxConnectionHandler | Constructs an event handler that connects vertices using the specified factory method to create the new edges. |
| graph | Reference to the enclosing mxGraph. |
| factoryMethod | Function that is used for creating new edges. |
| moveIconFront | Specifies if icons should be displayed inside the graph container instead of the overlay pane. |
| moveIconBack | Specifies if icons should be moved to the back of the overlay pane. |
| connectImage | mxImage that is used to trigger the creation of a new connection. |
| targetConnectImage | Specifies if the connect icon should be centered on the target state while connections are being previewed. |
| enabled | Specifies if events are handled. |
| select | Specifies if new edges should be selected. |
| createTarget | Specifies if createTargetVertex should be called if no target was under the mouse for the new connection. |
| marker | Holds the <mxTerminalMarker> used for finding source and target cells. |
| constraintHandler | Holds the mxConstraintHandler used for drawing and highlighting constraints. |
| error | Holds the current validation error while connections are being created. |
| waypointsEnabled | Specifies if single clicks should add waypoints on the new edge. |
| ignoreMouseDown | Specifies if the connection handler should ignore the state of the mouse button when highlighting the source. |
| first | Holds the mxPoint where the mouseDown took place while the handler is active. |
| connectIconOffset | Holds the offset for connect icons during connection preview. |
| edgeState | Optional mxCellState that represents the preview edge while the handler is active. |
| changeHandler | Holds the change event listener for later removal. |
| drillHandler | Holds the drill event listener for later removal. |
| mouseDownCounter | Counts the number of mouseDown events since the start. |
| movePreviewAway | Switch to enable moving the preview away from the mousepointer. |
| outlineConnect | Specifies if connections to the outline of a highlighted target should be enabled. |
| livePreview | Specifies if the actual shape of the edge state should be used for the preview. |
| cursor | Specifies the cursor to be used while the handler is active. |
| insertBeforeSource | Specifies if new edges should be inserted before the source vertex in the cell hierarchy. |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isInsertBefore | Returns insertBeforeSource for non-loops and false for loops. |
| isCreateTarget | Returns createTarget. |
| setCreateTarget | Sets createTarget. |
| createShape | Creates the preview shape for new connections. |
| init | Initializes the shapes required for this connection handler. |
| isConnectableCell | Returns true if the given cell is connectable. |
| createMarker | Creates and returns the mxCellMarker used in marker. |
| start | Starts a new connection for the given state and coordinates. |
| isConnecting | Returns true if the source terminal has been clicked and a new connection is currently being previewed. |
| isValidSource | Returns mxGraph.isValidSource for the given source terminal. |
| isValidTarget | Returns true. |
| validateConnection | Returns the error message or an empty string if the connection for the given source target pair is not valid. |
| getConnectImage | Hook to return the mxImage used for the connection icon of the given mxCellState. |
| isMoveIconToFrontForState | Returns true if the state has a HTML label in the graph’s container, otherwise it returns moveIconFront. |
| createIcons | Creates the array mxImageShapes that represent the connect icons for the given mxCellState. |
| redrawIcons | Redraws the given array of mxImageShapes. |
| redrawIcons | Redraws the given array of mxImageShapes. |
| destroyIcons | Destroys the connect icons and resets the respective state. |
| isStartEvent | Returns true if the given mouse down event should start this handler. |
| mouseDown | Handles the event by initiating a new connection. |
| isImmediateConnectSource | Returns true if a tap on the given source state should immediately start connecting. |
| createEdgeState | Hook to return an mxCellState which may be used during the preview. |
| isOutlineConnectEvent | Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed. |
| updateCurrentState | Updates the current state for a given mouse move event by using the marker. |
| isCellEnabled | Returns true if the given cell does not allow new connections to be created. |
| convertWaypoint | Converts the given point from screen coordinates to model coordinates. |
| snapToPreview | Called to snap the given point to the current preview. |
| mouseMove | Handles the event by updating the preview edge or by highlighting a possible source or target terminal. |
| updateEdgeState | Updates edgeState. |
| getTargetPerimeterPoint | Returns the perimeter point for the given target state. |
| getSourcePerimeterPoint | Hook to update the icon position(s) based on a mouseOver event. |
| updateIcons | Hook to update the icon position(s) based on a mouseOver event. |
| isStopEvent | Returns true if the given mouse up event should stop this handler. |
| addWaypoint | Adds the waypoint for the given event to <waypoints>. |
| checkConstraints | Returns true if the connection for the given constraints is valid. |
| mouseUp | Handles the event by inserting the new connection. |
| reset | Resets the state of this handler. |
| drawPreview | Redraws the preview edge using the color and width returned by getEdgeColor and getEdgeWidth. |
| getEdgeColor | Returns the color used to draw the preview edge. |
| getEdgeColor | Returns the color used to draw the preview edge. |
| getEdgeWidth | Returns the width used to draw the preview edge. |
| connect | Connects the given source and target using a new edge. |
| selectCells | Selects the given edge after adding a new connection. |
| insertEdge | Creates, inserts and returns the new edge for the given parameters. |
| createTargetVertex | Hook method for creating new vertices on the fly if no target was under the mouse. |
| getAlignmentTolerance | Returns the tolerance for aligning new targets to sources. |
| createEdge | Creates and returns a new edge using factoryMethod if one exists. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
Fires between begin- and endUpdate in connect. The <code>cell</code> property contains the inserted edge, the <code>event</code> and <code>target</code> properties contain the respective arguments that were passed to connect (where target corresponds to the dropTarget argument). Finally, the <code>terminal</code> property corresponds to the target argument in connect or the clone of the source terminal if createTarget is enabled.
Note that the target is the cell under the mouse where the mouse button was released. Depending on the logic in the handler, this doesn’t necessarily have to be the target of the inserted edge. To print the source, target or any optional ports IDs that the edge is connected to, the following code can be used. To get more details about the actual connection point, mxGraph.getConnectionConstraint can be used. To resolve the port IDs, use mxGraphModel.getCell.
graph.connectionHandler.addListener(mxEvent.CONNECT, function(sender, evt)
{
var edge = evt.getProperty('cell');
var source = graph.getModel().getTerminal(edge, true);
var target = graph.getModel().getTerminal(edge, false);
var style = graph.getCellStyle(edge);
var sourcePortId = style[mxConstants.STYLE_SOURCE_PORT];
var targetPortId = style[mxConstants.STYLE_TARGET_PORT];
mxLog.show();
mxLog.debug('connect', edge, source.id, target.id, sourcePortId, targetPortId);
});Fires when the reset method is invoked.
function mxConnectionHandler( graph, factoryMethod )
Constructs an event handler that connects vertices using the specified factory method to create the new edges. Modify <mxConstants.ACTIVE_REGION> to setup the region on a cell which triggers the creation of a new connection or use connect icons as explained above.
| graph | Reference to the enclosing mxGraph. |
| factoryMethod | Optional function to create the edge. The function takes the source and target mxCell as the first and second argument and an optional cell style from the preview as the third argument. It returns the mxCell that represents the new edge. |
mxConnectionHandler.prototype.graph
Reference to the enclosing mxGraph.
mxConnectionHandler.prototype.factoryMethod
Function that is used for creating new edges. The function takes the source and target mxCell as the first and second argument and returns a new mxCell that represents the edge. This is used in createEdge.
mxConnectionHandler.prototype.moveIconFront
Specifies if icons should be displayed inside the graph container instead of the overlay pane. This is used for HTML labels on vertices which hide the connect icon. This has precendence over moveIconBack when set to true. Default is false.
mxConnectionHandler.prototype.connectImage
mxImage that is used to trigger the creation of a new connection. This is used in createIcons. Default is null.
mxConnectionHandler.prototype.createTarget
Specifies if createTargetVertex should be called if no target was under the mouse for the new connection. Setting this to true means the connection will be drawn as valid if no target is under the mouse, and createTargetVertex will be called before the connection is created between the source cell and the newly created vertex in createTargetVertex, which can be overridden to create a new target. Default is false.
mxConnectionHandler.prototype.constraintHandler
Holds the mxConstraintHandler used for drawing and highlighting constraints.
mxConnectionHandler.prototype.first
Holds the mxPoint where the mouseDown took place while the handler is active.
mxConnectionHandler.prototype.connectIconOffset
Holds the offset for connect icons during connection preview. Default is mxPoint(0, mxConstants.TOOLTIP_VERTICAL_OFFSET). Note that placing the icon under the mouse pointer with an offset of (0,0) will affect hit detection.
mxConnectionHandler.prototype.edgeState
Optional mxCellState that represents the preview edge while the handler is active. This is created in createEdgeState.
mxConnectionHandler.prototype.movePreviewAway
Switch to enable moving the preview away from the mousepointer. This is required in browsers where the preview cannot be made transparent to events and if the built-in hit detection on the HTML elements in the page should be used. Default is the value of mxClient.IS_VML.
mxConnectionHandler.prototype.livePreview
Specifies if the actual shape of the edge state should be used for the preview. Default is false. (Ignored if no edge state is created in createEdgeState.)
mxConnectionHandler.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxConnectionHandler.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
| enabled | Boolean that specifies the new enabled state. |
mxConnectionHandler.prototype.isInsertBefore = function( edge, source, target, evt, dropTarget )
Returns insertBeforeSource for non-loops and false for loops.
| edge | mxCell that represents the edge to be inserted. |
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
| evt | Mousedown event of the connect gesture. |
| dropTarget | mxCell that represents the cell under the mouse when it was released. |
mxConnectionHandler.prototype.isCreateTarget = function( evt )
Returns createTarget.
| evt | Current active native pointer event. |
mxConnectionHandler.prototype.setCreateTarget = function( value )
Sets createTarget.
mxConnectionHandler.prototype.createMarker = function()
Creates and returns the mxCellMarker used in marker.
mxConnectionHandler.prototype.isValidSource = function( cell, me )
Returns mxGraph.isValidSource for the given source terminal.
| cell | mxCell that represents the source terminal. |
| me | mxMouseEvent that is associated with this call. |
mxConnectionHandler.prototype.isValidTarget = function( cell )
Returns true. The call to mxGraph.isValidTarget is implicit by calling mxGraph.getEdgeValidationError in validateConnection. This is an additional hook for disabling certain targets in this specific handler.
| cell | mxCell that represents the target terminal. |
mxConnectionHandler.prototype.validateConnection = function( source, target )
Returns the error message or an empty string if the connection for the given source target pair is not valid. Otherwise it returns null. This implementation uses mxGraph.getEdgeValidationError.
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
mxConnectionHandler.prototype.getConnectImage = function( state )
Hook to return the mxImage used for the connection icon of the given mxCellState. This implementation returns connectImage.
| state | mxCellState whose connect image should be returned. |
mxConnectionHandler.prototype.isMoveIconToFrontForState = function( state )
Returns true if the state has a HTML label in the graph’s container, otherwise it returns moveIconFront.
| state | mxCellState whose connect icons should be returned. |
mxConnectionHandler.prototype.createIcons = function( state )
Creates the array mxImageShapes that represent the connect icons for the given mxCellState.
| state | mxCellState whose connect icons should be returned. |
mxConnectionHandler.prototype.redrawIcons = function( icons, state )
Redraws the given array of mxImageShapes.
| icons | Optional array of mxImageShapes to be redrawn. |
Redraws the given array of mxImageShapes.
| icons | Optional array of mxImageShapes to be redrawn. |
mxConnectionHandler.prototype.isStartEvent = function( me )
Returns true if the given mouse down event should start this handler. The This implementation returns true if the event does not force marquee selection, and the currentConstraint and currentFocus of the constraintHandler are not null, or <previous> and error are not null and <icons> is null or <icons> and <icon> are not null.
mxConnectionHandler.prototype.createEdgeState = function( me )
Hook to return an mxCellState which may be used during the preview. This implementation returns null.
graph.connectionHandler.createEdgeState = function(me)
{
var edge = graph.createEdge(null, null, null, null, null, 'edgeStyle=elbowEdgeStyle');
return new mxCellState(this.graph.view, edge, this.graph.getCellStyle(edge));
};
mxConnectionHandler.prototype.isOutlineConnectEvent = function( me )
Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed.
mxConnectionHandler.prototype.updateCurrentState = function( me, point )
Updates the current state for a given mouse move event by using the marker.
mxConnectionHandler.prototype.updateEdgeState = function( current, constraint )
Updates edgeState.
mxConnectionHandler.prototype.getTargetPerimeterPoint = function( state, me )
Returns the perimeter point for the given target state.
| state | mxCellState that represents the target cell state. |
| me | mxMouseEvent that represents the mouse move. |
mxConnectionHandler.prototype.getSourcePerimeterPoint = function( state, next, me )
Hook to update the icon position(s) based on a mouseOver event. This is an empty implementation.
| state | mxCellState that represents the target cell state. |
| next | mxPoint that represents the next point along the previewed edge. |
| me | mxMouseEvent that represents the mouse move. |
mxConnectionHandler.prototype.updateIcons = function( state, icons, me )
Hook to update the icon position(s) based on a mouseOver event. This is an empty implementation.
| state | mxCellState under the mouse. |
| icons | Array of currently displayed icons. |
| me | mxMouseEvent that contains the mouse event. |
mxConnectionHandler.prototype.isStopEvent = function( me )
Returns true if the given mouse up event should stop this handler. The connection will be created if error is null. Note that this is only called if waypointsEnabled is true. This implemtation returns true if there is a cell state in the given event.
mxConnectionHandler.prototype.drawPreview = function()
Redraws the preview edge using the color and width returned by getEdgeColor and getEdgeWidth.
mxConnectionHandler.prototype.connect = function( source, target, evt, dropTarget )
Connects the given source and target using a new edge. This implementation uses createEdge to create the edge.
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
| evt | Mousedown event of the connect gesture. |
| dropTarget | mxCell that represents the cell under the mouse when it was released. |
mxConnectionHandler.prototype.insertEdge = function( parent, id, value, source, target, style )
Creates, inserts and returns the new edge for the given parameters. This implementation does only use createEdge if factoryMethod is defined, otherwise mxGraph.insertEdge will be used.
mxConnectionHandler.prototype.createTargetVertex = function( evt, source )
Hook method for creating new vertices on the fly if no target was under the mouse. This is only called if createTarget is true and returns null.
| evt | Mousedown event of the connect gesture. |
| source | mxCell that represents the source terminal. |
mxConnectionHandler.prototype.createEdge = function( value, source, target, style )
Creates and returns a new edge using factoryMethod if one exists. If no factory method is defined, then a new default edge is returned. The source and target arguments are informal, the actual connection is setup later by the caller of this function.
| value | Value to be used for creating the edge. |
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
| style | Optional style from the preview edge. |
mxConnectionHandler.prototype.destroy = function()
Destroys the handler and all its resources and DOM nodes. This should be called on all instances. It is called automatically for the built-in instance created for each mxGraph.
Handles constraints on connection targets. This class is in charge of showing fixed points when the mouse is over a vertex and handles constraints to establish new connections.
| Functions | |
| mxConstraintHandler | Constructs an new constraint handler. |
| Variables | |
| pointImage | mxImage to be used as the image for fixed connection points. |
| graph | Reference to the enclosing mxGraph. |
| enabled | Specifies if events are handled. |
| highlightColor | Specifies the color for the highlight. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| reset | Resets the state of this handler. |
| getTolerance | Returns the tolerance to be used for intersecting connection points. |
| getImageForConstraint | Returns the tolerance to be used for intersecting connection points. |
| isEventIgnored | Returns true if the given mxMouseEvent should be ignored in update. |
| isStateIgnored | Returns true if the given state should be ignored. |
| destroyIcons | Destroys the <focusIcons> if they exist. |
| destroyFocusHighlight | Destroys the <focusHighlight> if one exists. |
| isKeepFocusEvent | Returns true if the current focused state should not be changed for the given event. |
| getCellForEvent | Returns the cell for the given event. |
| update | Updates the state of this handler based on the given mxMouseEvent. |
| redraw | Transfers the focus to the given state as a source or target terminal. |
| setFocus | Transfers the focus to the given state as a source or target terminal. |
| createHighlightShape | Create the shape used to paint the highlight. |
| intersects | Returns true if the given icon intersects the given rectangle. |
| destroy | Destroy this handler. |
function mxConstraintHandler( graph )
Constructs an new constraint handler.
| graph | Reference to the enclosing mxGraph. |
| factoryMethod | Optional function to create the edge. The function takes the source and target mxCell as the first and second argument and returns the mxCell that represents the new edge. |
mxConstraintHandler.prototype.pointImage
mxImage to be used as the image for fixed connection points.
mxConstraintHandler.prototype.graph
Reference to the enclosing mxGraph.
mxConstraintHandler.prototype.highlightColor
Specifies the color for the highlight. Default is mxConstants.DEFAULT_VALID_COLOR.
mxConstraintHandler.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxConstraintHandler.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
| enabled | Boolean that specifies the new enabled state. |
mxConstraintHandler.prototype.getTolerance = function( me )
Returns the tolerance to be used for intersecting connection points. This implementation returns mxGraph.tolerance.
| me | mxMouseEvent whose tolerance should be returned. |
mxConstraintHandler.prototype.isEventIgnored = function( me, source )
Returns true if the given mxMouseEvent should be ignored in update. This implementation always returns false.
mxConstraintHandler.prototype.update = function( me, source, existingEdge, point )
Updates the state of this handler based on the given mxMouseEvent. Source is a boolean indicating if the cell is a source or target.
Event handler that selects rectangular regions. This is not built-into mxGraph. To enable rubberband selection in a graph, use the following code.
var rubberband = new mxRubberband(graph);
| Functions | |
| mxRubberband | Constructs an event handler that selects rectangular regions in the graph using rubberband selection. |
| Variables | |
| defaultOpacity | Specifies the default opacity to be used for the rubberband div. |
| enabled | Specifies if events are handled. |
| div | Holds the DIV element which is currently visible. |
| sharedDiv | Holds the DIV element which is used to display the rubberband. |
| currentX | Holds the value of the x argument in the last call to update. |
| currentY | Holds the value of the y argument in the last call to update. |
| fadeOut | Optional fade out effect. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isForceRubberbandEvent | Returns true if the given mxMouseEvent should start rubberband selection. |
| mouseDown | Handles the event by initiating a rubberband selection. |
| start | Sets the start point for the rubberband selection. |
| mouseMove | Handles the event by updating therubberband selection. |
| createShape | Creates the rubberband selection shape. |
| isActive | Returns true if this handler is active. |
| mouseUp | Handles the event by selecting the region of the rubberband using mxGraph.selectRegion. |
| execute | Resets the state of this handler and selects the current region for the given event. |
| reset | Resets the state of the rubberband selection. |
| update | Sets currentX and currentY and calls repaint. |
| repaint | Computes the bounding box and updates the style of the div. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
mxRubberband.prototype.currentX
Holds the value of the x argument in the last call to update.
mxRubberband.prototype.currentY
Holds the value of the y argument in the last call to update.
mxRubberband.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxRubberband.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
mxRubberband.prototype.isForceRubberbandEvent = function( me )
Returns true if the given mxMouseEvent should start rubberband selection. This implementation returns true if the alt key is pressed.
mxRubberband.prototype.mouseUp = function( sender, me )
Handles the event by selecting the region of the rubberband using mxGraph.selectRegion.
mxRubberband.prototype.repaint = function()
Computes the bounding box and updates the style of the div.
Implements a single custom handle for vertices.
| Functions | |
| mxHandle | Constructs a new handle for the given state. |
| Variables | |
| cursor | Specifies the cursor to be used for this handle. |
| image | Specifies the mxImage to be used to render the handle. |
| image | Specifies the mxImage to be used to render the handle. |
| Functions | |
| getPosition | Hook for subclassers to return the current position of the handle. |
| setPosition | Hooks for subclassers to update the style in the <state>. |
| execute | Hook for subclassers to execute the handle. |
| copyStyle | Sets the cell style with the given name to the corresponding value in <state>. |
| processEvent | Processes the given mxMouseEvent and invokes setPosition. |
| positionChanged | Called after setPosition has been called in processEvent. |
| getRotation | Returns the rotation defined in the style of the cell. |
| getTotalRotation | Returns the rotation from the style and the rotation from the direction of the cell. |
| init | Creates and initializes the shapes required for this handle. |
| createShape | Creates and returns the shape for this handle. |
| initShape | Initializes <shape> and sets its cursor. |
| redraw | Renders the shape for this handle. |
| isHtmlRequired | Returns true if this handle should be rendered in HTML. |
| rotatePoint | Rotates the point by the given angle. |
| flipPoint | Flips the given point vertically and/or horizontally. |
| snapPoint | Snaps the given point to the grid if ignore is false. |
| setVisible | Shows or hides this handle. |
| reset | Resets the state of this handle by setting its visibility to true. |
| destroy | Destroys this handle. |
function mxHandle( state, cursor, image )
Constructs a new handle for the given state.
| state | mxCellState of the cell to be handled. |
mxHandle.prototype.image
Specifies the mxImage to be used to render the handle. Default is null.
Specifies the mxImage to be used to render the handle. Default is null.
mxHandle.prototype.processEvent = function( me )
Processes the given mxMouseEvent and invokes setPosition.
mxHandle.prototype.positionChanged = function()
Called after setPosition has been called in processEvent. This repaints the state using mxCellRenderer.
Event handler for resizing cells. This handler is automatically created in mxGraph.createHandler.
| Functions | |
| mxVertexHandler | Constructs an event handler that allows to resize vertices and groups. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| state | Reference to the mxCellState being modified. |
| singleSizer | Specifies if only one sizer handle at the bottom, right corner should be used. |
| index | Holds the index of the current handle. |
| allowHandleBoundsCheck | Specifies if the bounds of handles should be used for hit-detection in IE or if tolerance > 0. |
| handleImage | Optional mxImage to be used as handles. |
| tolerance | Optional tolerance for hit-detection in getHandleForEvent. |
| rotationEnabled | Specifies if a rotation handle should be visible. |
| parentHighlightEnabled | Specifies if the parent should be highlighted if a child cell is selected. |
| rotationRaster | Specifies if rotation steps should be “rasterized” depening on the distance to the handle. |
| rotationCursor | Specifies the cursor for the rotation handle. |
| livePreview | Specifies if resize should change the cell in-place. |
| manageSizers | Specifies if sizers should be hidden and spaced if the vertex is small. |
| constrainGroupByChildren | Specifies if the size of groups should be constrained by the children. |
| rotationHandleVSpacing | Vertical spacing for rotation icon. |
| horizontalOffset | The horizontal offset for the handles. |
| verticalOffset | The horizontal offset for the handles. |
| Functions | |
| init | Initializes the shapes required for this vertex handler. |
| isRotationHandleVisible | Returns true if the rotation handle should be showing. |
| isConstrainedEvent | Returns true if the aspect ratio if the cell should be maintained. |
| isCenteredEvent | Returns true if the center of the vertex should be maintained during the resize. |
| createCustomHandles | Returns an array of custom handles. |
| updateMinBounds | Initializes the shapes required for this vertex handler. |
| getSelectionBounds | Returns the mxRectangle that defines the bounds of the selection border. |
| createParentHighlightShape | Creates the shape used to draw the selection border. |
| createSelectionShape | Creates the shape used to draw the selection border. |
| getSelectionColor | Returns mxConstants.VERTEX_SELECTION_COLOR. |
| getSelectionStrokeWidth | Returns mxConstants.VERTEX_SELECTION_STROKEWIDTH. |
| isSelectionDashed | Returns <mxConstants.VERTEX_SELECTION_DASHED>. |
| createSizer | Creates a sizer handle for the specified cursor and index and returns the new mxRectangleShape that represents the handle. |
| isSizerVisible | Returns true if the sizer for the given index is visible. |
| createSizerShape | Creates the shape used for the sizer handle for the specified bounds an index. |
| createBounds | Helper method to create an mxRectangle around the given centerpoint with a width and height of 2*s or 6, if no s is given. |
| getHandleForEvent | Returns the index of the handle for the given event. |
| isCustomHandleEvent | Returns true if the given event allows custom handles to be changed. |
| mouseDown | Handles the event if a handle has been clicked. |
| isLivePreviewBorder | Called if livePreview is enabled to check if a border should be painted. |
| start | Starts the handling of the mouse gesture. |
| hideHandles | Shortcut to hideSizers. |
| hideSizers | Hides all sizers except. |
| checkTolerance | Checks if the coordinates for the given event are within the mxGraph.tolerance. |
| updateHint | Hook for subclassers do show details while the handler is active. |
| removeHint | Hooks for subclassers to hide details when the handler gets inactive. |
| roundAngle | Hook for rounding the angle. |
| roundLength | Hook for rounding the unscaled width or height. |
| mouseMove | Handles the event by updating the preview. |
| rotateVertex | Rotates the vertex. |
| rotateVertex | Rotates the vertex. |
| rotateVertex | Rotates the vertex. |
| updateLivePreview | Repaints the live preview. |
| mouseUp | Handles the event by applying the changes to the geometry. |
| rotateCell | Rotates the given cell to the given rotation. |
| rotateClick | Hook for subclassers to implement a single click on the rotation handle. |
| rotateCell | Rotates the given cell and its children by the given angle in degrees. |
| reset | Resets the state of this handler. |
| resizeCell | Uses the given vector to change the bounds of the given cell in the graph using mxGraph.resizeCell. |
| moveChildren | Moves the children of the given cell by the given vector. |
| union | Returns the union of the given bounds and location for the specified handle index. |
| redraw | Redraws the handles and the preview. |
| redrawHandles | Redraws the handles. |
| getRotationHandlePosition | Returns an mxPoint that defines the rotation handle position. |
| updateParentHighlight | Updates the highlight of the parent if parentHighlightEnabled is true. |
| drawPreview | Redraws the preview. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
function mxVertexHandler( state )
Constructs an event handler that allows to resize vertices and groups.
| state | mxCellState of the cell to be resized. |
mxVertexHandler.prototype.graph
Reference to the enclosing mxGraph.
mxVertexHandler.prototype.state
Reference to the mxCellState being modified.
mxVertexHandler.prototype.allowHandleBoundsCheck
Specifies if the bounds of handles should be used for hit-detection in IE or if tolerance > 0. Default is true.
mxVertexHandler.prototype.handleImage
Optional mxImage to be used as handles. Default is null.
mxVertexHandler.prototype.tolerance
Optional tolerance for hit-detection in getHandleForEvent. Default is 0.
mxVertexHandler.prototype.horizontalOffset
The horizontal offset for the handles. This is updated in redrawHandles if manageSizers is true and the sizers are offset horizontally.
mxVertexHandler.prototype.verticalOffset
The horizontal offset for the handles. This is updated in redrawHandles if manageSizers is true and the sizers are offset vertically.
mxVertexHandler.prototype.getSelectionColor = function()
Returns mxConstants.VERTEX_SELECTION_COLOR.
mxVertexHandler.prototype.createSizer = function( cursor, index, size, fillColor )
Creates a sizer handle for the specified cursor and index and returns the new mxRectangleShape that represents the handle.
Helper method to create an mxRectangle around the given centerpoint with a width and height of 2*s or 6, if no s is given.
mxVertexHandler.prototype.isLivePreviewBorder = function()
Called if livePreview is enabled to check if a border should be painted. This implementation returns true if the shape is transparent.
Shortcut to hideSizers.
mxVertexHandler.prototype.checkTolerance = function( me )
Checks if the coordinates for the given event are within the mxGraph.tolerance. If the event is a mouse event then the tolerance is ignored.
mxVertexHandler.prototype.rotateCell = function( cell, angle, parent )
Rotates the given cell and its children by the given angle in degrees.
| cell | mxCell to be rotated. |
| angle | Angle in degrees. |
mxVertexHandler.prototype.resizeCell = function( cell, dx, dy, index, gridEnabled, constrained, recurse )
Uses the given vector to change the bounds of the given cell in the graph using mxGraph.resizeCell.
mxVertexHandler.prototype.union = function( bounds, dx, dy, index, gridEnabled, scale, tr, constrained, centered )
Returns the union of the given bounds and location for the specified handle index.
To override this to limit the size of vertex via a minWidth/-Height style, the following code can be used.
var vertexHandlerUnion = mxVertexHandler.prototype.union;
mxVertexHandler.prototype.union = function(bounds, dx, dy, index, gridEnabled, scale, tr, constrained)
{
var result = vertexHandlerUnion.apply(this, arguments);
result.width = Math.max(result.width, mxUtils.getNumber(this.state.style, 'minWidth', 0));
result.height = Math.max(result.height, mxUtils.getNumber(this.state.style, 'minHeight', 0));
return result;
};graph.insertVertex(parent, null, 'Hello,', 20, 20, 80, 30, 'minWidth=100;minHeight=100;');
To override this to update the height for a wrapped text if the width of a vertex is changed, the following can be used.
var mxVertexHandlerUnion = mxVertexHandler.prototype.union;
mxVertexHandler.prototype.union = function(bounds, dx, dy, index, gridEnabled, scale, tr, constrained)
{
var result = mxVertexHandlerUnion.apply(this, arguments);
var s = this.state;
if (this.graph.isHtmlLabel(s.cell) && (index == 3 || index == 4) &&
s.text != null && s.style[mxConstants.STYLE_WHITE_SPACE] == 'wrap')
{
var label = this.graph.getLabel(s.cell);
var fontSize = mxUtils.getNumber(s.style, mxConstants.STYLE_FONTSIZE, mxConstants.DEFAULT_FONTSIZE);
var ww = result.width / s.view.scale - s.text.spacingRight - s.text.spacingLeft
result.height = mxUtils.getSizeForString(label, fontSize, s.style[mxConstants.STYLE_FONTFAMILY], ww).height;
}
return result;
};
mxVertexHandler.prototype.redrawHandles = function()
Redraws the handles. To hide certain handles the following code can be used.
mxVertexHandler.prototype.redrawHandles = function()
{
mxVertexHandlerRedrawHandles.apply(this, arguments);
if (this.sizers != null && this.sizers.length > 7)
{
this.sizers[1].node.style.display = 'none';
this.sizers[6].node.style.display = 'none';
}
};
mxVertexHandler.prototype.getRotationHandlePosition = function()
Returns an mxPoint that defines the rotation handle position.
mxVertexHandler.prototype.updateParentHighlight = function()
Updates the highlight of the parent if parentHighlightEnabled is true.
Graph event handler that reconnects edges and modifies control points and the edge label location. Uses <mxTerminalMarker> for finding and highlighting new source and target vertices. This handler is automatically created in mxGraph.createHandler for each selected edge.
mxEdgeHandler.prototype.addEnabled = true; mxEdgeHandler.prototype.removeEnabled = true;
Note: This experimental feature is not recommended for production use.
| Functions | |
| mxEdgeHandler | Constructs an edge handler for the specified mxCellState. |
| Variables | |
| graph | Reference to the enclosing mxGraph. |
| state | Reference to the mxCellState being modified. |
| marker | Holds the <mxTerminalMarker> which is used for highlighting terminals. |
| constraintHandler | Holds the mxConstraintHandler used for drawing and highlighting constraints. |
| error | Holds the current validation error while a connection is being changed. |
| shape | Holds the mxShape that represents the preview edge. |
| bends | Holds the mxShapes that represent the points. |
| labelShape | Holds the mxShape that represents the label position. |
| cloneEnabled | Specifies if cloning by control-drag is enabled. |
| addEnabled | Specifies if adding bends by shift-click is enabled. |
| removeEnabled | Specifies if removing bends by shift-click is enabled. |
| dblClickRemoveEnabled | Specifies if removing bends by double click is enabled. |
| mergeRemoveEnabled | Specifies if removing bends by dropping them on other bends is enabled. |
| straightRemoveEnabled | Specifies if removing bends by creating straight segments should be enabled. |
| virtualBendsEnabled | Specifies if virtual bends should be added in the center of each segments. |
| virtualBendOpacity | Opacity to be used for virtual bends (see virtualBendsEnabled). |
| parentHighlightEnabled | Specifies if the parent should be highlighted if a child cell is selected. |
| preferHtml | Specifies if bends should be added to the graph container. |
| allowHandleBoundsCheck | Specifies if the bounds of handles should be used for hit-detection in IE Default is true. |
| snapToTerminals | Specifies if waypoints should snap to the routing centers of terminals. |
| handleImage | Optional mxImage to be used as handles. |
| tolerance | Optional tolerance for hit-detection in getHandleForEvent. |
| outlineConnect | Specifies if connections to the outline of a highlighted target should be enabled. |
| manageLabelHandle | Specifies if the label handle should be moved if it intersects with another handle. |
| Functions | |
| init | Initializes the shapes required for this edge handler. |
| createCustomHandles | Returns an array of custom handles. |
| isVirtualBendsEnabled | Returns true if virtual bends should be added. |
| isAddPointEvent | Returns true if the given event is a trigger to add a new point. |
| isRemovePointEvent | Returns true if the given event is a trigger to remove a point. |
| getSelectionPoints | Returns the list of points that defines the selection stroke. |
| createSelectionShape | Creates the shape used to draw the selection border. |
| createSelectionShape | Creates the shape used to draw the selection border. |
| getSelectionColor | Returns mxConstants.EDGE_SELECTION_COLOR. |
| getSelectionStrokeWidth | Returns mxConstants.EDGE_SELECTION_STROKEWIDTH. |
| isSelectionDashed | Returns <mxConstants.EDGE_SELECTION_DASHED>. |
| isConnectableCell | Returns true if the given cell is connectable. |
| getCellAt | Creates and returns the mxCellMarker used in marker. |
| createMarker | Creates and returns the mxCellMarker used in marker. |
| validateConnection | Returns the error message or an empty string if the connection for the given source, target pair is not valid. |
| createBends | Creates and returns the bends used for modifying the edge. |
| createVirtualBends | Creates and returns the bends used for modifying the edge. |
| isHandleEnabled | Creates the shape used to display the given bend. |
| isHandleVisible | Returns true if the handle at the given index is visible. |
| createHandleShape | Creates the shape used to display the given bend. |
| createLabelHandleShape | Creates the shape used to display the the label handle. |
| initBend | Helper method to initialize the given bend. |
| getHandleForEvent | Returns the index of the handle for the given event. |
| isAddVirtualBendEvent | Returns true if the given event allows virtual bends to be added. |
| isCustomHandleEvent | Returns true if the given event allows custom handles to be changed. |
| mouseDown | Handles the event by checking if a special element of the handler was clicked, in which case the index parameter is non-null. |
| start | Starts the handling of the mouse gesture. |
| clonePreviewState | Returns a clone of the current preview state for the given point and terminal. |
| getSnapToTerminalTolerance | Returns the tolerance for the guides. |
| updateHint | Hook for subclassers do show details while the handler is active. |
| removeHint | Hooks for subclassers to hide details when the handler gets inactive. |
| roundLength | Hook for rounding the unscaled width or height. |
| isSnapToTerminalsEvent | Returns true if snapToTerminals is true and if alt is not pressed. |
| getPointForEvent | Returns the point for the given event. |
| getPreviewTerminalState | Updates the given preview state taking into account the state of the constraint handler. |
| getPreviewPoints | Updates the given preview state taking into account the state of the constraint handler. |
| isOutlineConnectEvent | Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed. |
| updatePreviewState | Updates the given preview state taking into account the state of the constraint handler. |
| mouseMove | Handles the event by updating the preview. |
| mouseUp | Handles the event to applying the previewed changes on the edge by using moveLabel, connect or changePoints. |
| reset | Resets the state of this handler. |
| setPreviewColor | Sets the color of the preview to the given value. |
| convertPoint | Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid. |
| moveLabel | Changes the coordinates for the label of the given edge. |
| connect | Changes the terminal or terminal point of the given edge in the graph model. |
| changeTerminalPoint | Changes the terminal point of the given edge. |
| changePoints | Changes the control points of the given edge in the graph model. |
| addPoint | Adds a control point for the given state and event. |
| addPointAt | Adds a control point at the given point. |
| removePoint | Removes the control point at the given index from the given state. |
| getHandleFillColor | Returns the fillcolor for the handle at the given index. |
| redraw | Redraws the preview, and the bends- and label control points. |
| redrawHandles | Redraws the handles. |
| hideHandles | Shortcut to <hideSizers>. |
| redrawInnerBends | Updates and redraws the inner bends. |
| checkLabelHandle | Checks if the label handle intersects the given bounds and moves it if it intersects. |
| drawPreview | Redraws the preview. |
| refresh | Refreshes the bends of this handler. |
| destroyBends | Destroys all elements in bends. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
function mxEdgeHandler( state )
Constructs an edge handler for the specified mxCellState.
| state | mxCellState of the cell to be handled. |
mxEdgeHandler.prototype.graph
Reference to the enclosing mxGraph.
mxEdgeHandler.prototype.state
Reference to the mxCellState being modified.
mxEdgeHandler.prototype.constraintHandler
Holds the mxConstraintHandler used for drawing and highlighting constraints.
mxEdgeHandler.prototype.shape
Holds the mxShape that represents the preview edge.
mxEdgeHandler.prototype.bends
Holds the mxShapes that represent the points.
mxEdgeHandler.prototype.labelShape
Holds the mxShape that represents the label position.
mxEdgeHandler.prototype.virtualBendOpacity
Opacity to be used for virtual bends (see virtualBendsEnabled). Default is 20.
mxEdgeHandler.prototype.preferHtml
Specifies if bends should be added to the graph container. This is updated in init based on whether the edge or one of its terminals has an HTML label in the container.
mxEdgeHandler.prototype.handleImage
Optional mxImage to be used as handles. Default is null.
mxEdgeHandler.prototype.tolerance
Optional tolerance for hit-detection in getHandleForEvent. Default is 0.
mxEdgeHandler.prototype.manageLabelHandle
Specifies if the label handle should be moved if it intersects with another handle. Uses checkLabelHandle for checking and moving. Default is false.
mxEdgeHandler.prototype.isVirtualBendsEnabled = function( evt )
Returns true if virtual bends should be added. This returns true if virtualBendsEnabled is true and the current style allows and renders custom waypoints.
mxEdgeHandler.prototype.getSelectionColor = function()
Returns mxConstants.EDGE_SELECTION_COLOR.
mxEdgeHandler.prototype.getCellAt = function( x, y )
Creates and returns the mxCellMarker used in marker.
mxEdgeHandler.prototype.createMarker = function()
Creates and returns the mxCellMarker used in marker.
mxEdgeHandler.prototype.validateConnection = function( source, target )
Returns the error message or an empty string if the connection for the given source, target pair is not valid. Otherwise it returns null. This implementation uses mxGraph.getEdgeValidationError.
| source | mxCell that represents the source terminal. |
| target | mxCell that represents the target terminal. |
mxEdgeHandler.prototype.createBends = function()
Creates and returns the bends used for modifying the edge. This is typically an array of mxRectangleShapes.
mxEdgeHandler.prototype.createVirtualBends = function()
Creates and returns the bends used for modifying the edge. This is typically an array of mxRectangleShapes.
mxEdgeHandler.prototype.createHandleShape = function( index )
Creates the shape used to display the given bend. Note that the index may be null for special cases, such as when called from mxElbowEdgeHandler.createVirtualBend. Only images and rectangles should be returned if support for HTML labels with not foreign objects is required. Index if null for virtual handles.
mxEdgeHandler.prototype.initBend = function( bend, dblClick )
Helper method to initialize the given bend.
| bend | mxShape that represents the bend to be initialized. |
mxEdgeHandler.prototype.mouseDown = function( sender, me )
Handles the event by checking if a special element of the handler was clicked, in which case the index parameter is non-null. The indices may be one of <LABEL_HANDLE> or the number of the respective control point. The source and target points are used for reconnecting the edge.
mxEdgeHandler.prototype.isSnapToTerminalsEvent = function( me )
Returns true if snapToTerminals is true and if alt is not pressed.
mxEdgeHandler.prototype.getPreviewPoints = function( pt, me )
Updates the given preview state taking into account the state of the constraint handler.
| pt | mxPoint that contains the current pointer position. |
| me | Optional mxMouseEvent that contains the current event. |
mxEdgeHandler.prototype.isOutlineConnectEvent = function( me )
Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed.
mxEdgeHandler.prototype.mouseUp = function( sender, me )
Handles the event to applying the previewed changes on the edge by using moveLabel, connect or changePoints.
mxEdgeHandler.prototype.convertPoint = function( point, gridEnabled )
Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid. Returns the given, modified point instance.
| point | mxPoint to be converted. |
| gridEnabled | Boolean that specifies if the grid should be applied. |
mxEdgeHandler.prototype.moveLabel = function( edgeState, x, y )
Changes the coordinates for the label of the given edge.
| edge | mxCell that represents the edge. |
| x | Integer that specifies the x-coordinate of the new location. |
| y | Integer that specifies the y-coordinate of the new location. |
mxEdgeHandler.prototype.connect = function( edge, terminal, isSource, isClone, me )
Changes the terminal or terminal point of the given edge in the graph model.
| edge | mxCell that represents the edge to be reconnected. |
| terminal | mxCell that represents the new terminal. |
| isSource | Boolean indicating if the new terminal is the source or target terminal. |
| isClone | Boolean indicating if the new connection should be a clone of the old edge. |
| me | mxMouseEvent that contains the mouse up event. |
mxEdgeHandler.prototype.destroyBends = function( bends )
Destroys all elements in bends.
Graph event handler that reconnects edges and modifies control points and the edge label location. Uses <mxTerminalMarker> for finding and highlighting new source and target vertices. This handler is automatically created in mxGraph.createHandler. It extends mxEdgeHandler.
| Functions | |
| mxEdgeHandler | Constructs an edge handler for the specified mxCellState. |
| Variables | |
| doubleClickOrientationResource | Specifies the resource key for the tooltip to be displayed on the single control point for routed edges. |
| Functions | |
| createBends | Overrides mxEdgeHandler.createBends to create custom bends. |
| createVirtualBend | Creates a virtual bend that supports double clicking and calls mxGraph.flipEdge. |
| getCursorForBend | Returns the cursor to be used for the bend. |
| getTooltipForNode | Returns the tooltip for the given node. |
| convertPoint | Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid. |
| redrawInnerBends | Updates and redraws the inner bends. |
| getCurrentPoints | Returns the current absolute points. |
| getPreviewPoints | Updates the given preview state taking into account the state of the constraint handler. |
| updatePreviewState | Overridden to perform optimization of the edge style result. |
| getTooltipForNode | Returns no tooltips. |
| createBends | Adds custom bends for the center of each segment. |
| createBends | Adds custom bends for the center of each segment. |
| redraw | Overridden to invoke <refresh> before the redraw. |
| redrawInnerBends | Updates the position of the custom bends. |
Constructs an edge handler for the specified mxCellState.
| state | mxCellState of the cell to be modified. |
mxElbowEdgeHandler.prototype.doubleClickOrientationResource
Specifies the resource key for the tooltip to be displayed on the single control point for routed edges. If the resource for this key does not exist then the value is used as the error message. Default is ‘doubleClickOrientation’.
mxElbowEdgeHandler.prototype.createBends = function()
Overrides mxEdgeHandler.createBends to create custom bends.
mxElbowEdgeHandler.prototype.createVirtualBend = function( dblClickHandler )
Creates a virtual bend that supports double clicking and calls mxGraph.flipEdge.
mxElbowEdgeHandler.prototype.convertPoint = function( point, gridEnabled )
Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid.
| point | mxPoint to be converted. |
| gridEnabled | Boolean that specifies if the grid should be applied. |
Event handler that listens to keystroke events. This is not a singleton, however, it is normally only required once if the target is the document element (default).
This handler installs a key event listener in the topmost DOM node and processes all events that originate from descandants of <mxGraph.container> or from the topmost DOM node. The latter means that all unhandled keystrokes are handled by this object regardless of the focused state of the graph.
The following example creates a key handler that listens to the delete key (46) and deletes the selection cells if the graph is enabled.
var keyHandler = new mxKeyHandler(graph);
keyHandler.bindKey(46, function(evt)
{
if (graph.isEnabled())
{
graph.removeCells();
}
});See http://tinyurl.com/yp8jgl or http://tinyurl.com/229yqw for a list of keycodes or install a key event listener into the document element and print the key codes of the respective events to the console.
To support the Command key and the Control key on the Mac, the following code can be used.
keyHandler.getFunction = function(evt)
{
if (evt != null)
{
return (mxEvent.isControlDown(evt) || (mxClient.IS_MAC && evt.metaKey)) ? this.controlKeys[evt.keyCode] : this.normalKeys[evt.keyCode];
}
return null;
};| Functions | |
| mxKeyHandler | Constructs an event handler that executes functions bound to specific keystrokes. |
| Variables | |
| graph | Reference to the mxGraph associated with this handler. |
| target | Reference to the target DOM, that is, the DOM node where the key event listeners are installed. |
| normalKeys | Maps from keycodes to functions for non-pressed control keys. |
| shiftKeys | Maps from keycodes to functions for pressed shift keys. |
| controlKeys | Maps from keycodes to functions for pressed control keys. |
| controlShiftKeys | Maps from keycodes to functions for pressed control and shift keys. |
| enabled | Specifies if events are handled. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling by updating enabled. |
| bindKey | Binds the specified keycode to the given function. |
| bindShiftKey | Binds the specified keycode to the given function. |
| bindControlKey | Binds the specified keycode to the given function. |
| bindControlShiftKey | Binds the specified keycode to the given function. |
| isControlDown | Returns true if the control key is pressed. |
| getFunction | Returns the function associated with the given key event or null if no function is associated with the given event. |
| isGraphEvent | Returns true if the event should be processed by this handler, that is, if the event source is either the target, one of its direct children, a descendant of the <mxGraph.container>, or the mxGraph.cellEditor of the graph. |
| keyDown | Handles the event by invoking the function bound to the respective keystroke if isEnabledForEvent returns true for the given event and if isEventIgnored returns false, except for escape for which isEventIgnored is not invoked. |
| isEnabledForEvent | Returns true if the given event should be handled. |
| isEventIgnored | Returns true if the given keystroke should be ignored. |
| escape | Hook to process ESCAPE keystrokes. |
| destroy | Destroys the handler and all its references into the DOM. |
function mxKeyHandler( graph, target )
Constructs an event handler that executes functions bound to specific keystrokes.
| graph | Reference to the associated mxGraph. |
| target | Optional reference to the event target. If null, the document element is used as the event target, that is, the object where the key event listener is installed. |
mxKeyHandler.prototype.graph
Reference to the mxGraph associated with this handler.
mxKeyHandler.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxKeyHandler.prototype.setEnabled = function( enabled )
Enables or disables event handling by updating enabled.
| enabled | Boolean that specifies the new enabled state. |
mxKeyHandler.prototype.bindControlShiftKey = function( code, funct )
Binds the specified keycode to the given function. This binding is used if the control and shift key are pressed.
| code | Integer that specifies the keycode. |
| funct | JavaScript function that takes the key event as an argument. |
mxKeyHandler.prototype.isControlDown = function( evt )
Returns true if the control key is pressed. This uses mxEvent.isControlDown.
| evt | Key event whose control key pressed state should be returned. |
mxKeyHandler.prototype.isGraphEvent = function( evt )
Returns true if the event should be processed by this handler, that is, if the event source is either the target, one of its direct children, a descendant of the <mxGraph.container>, or the mxGraph.cellEditor of the graph.
| evt | Key event that represents the keystroke. |
mxKeyHandler.prototype.keyDown = function( evt )
Handles the event by invoking the function bound to the respective keystroke if isEnabledForEvent returns true for the given event and if isEventIgnored returns false, except for escape for which isEventIgnored is not invoked.
| evt | Key event that represents the keystroke. |
mxKeyHandler.prototype.isEnabledForEvent = function( evt )
Returns true if the given event should be handled. isEventIgnored is called later if the event is not an escape key stroke, in which case escape is called. This implementation returns true if isEnabled returns true for both, this handler and graph, if the event is not consumed and if isGraphEvent returns true.
| evt | Key event that represents the keystroke. |
mxKeyHandler.prototype.escape = function( evt )
Hook to process ESCAPE keystrokes. This implementation invokes mxGraph.stopEditing to cancel the current editing, connecting and/or other ongoing modifications.
| evt | Key event that represents the keystroke. Possible keycode in this case is 27 (ESCAPE). |
Graph event handler that displays tooltips. mxGraph.getTooltip is used to get the tooltip for a cell or handle. This handler is built-into <mxGraph.tooltipHandler> and enabled using mxGraph.setTooltips.
(code> new mxTooltipHandler(graph); (end)
| Functions | |
| mxTooltipHandler | Constructs an event handler that displays tooltips with the specified delay (in milliseconds). |
| Variables | |
| zIndex | Specifies the zIndex for the tooltip and its shadow. |
| graph | Reference to the enclosing mxGraph. |
| delay | Delay to show the tooltip in milliseconds. |
| ignoreTouchEvents | Specifies if touch and pen events should be ignored. |
| hideOnHover | Specifies if the tooltip should be hidden if the mouse is moved over the current cell. |
| destroyed | True if this handler was destroyed using destroy. |
| enabled | Specifies if events are handled. |
| Functions | |
| isEnabled | Returns true if events are handled. |
| setEnabled | Enables or disables event handling. |
| isHideOnHover | Returns hideOnHover. |
| setHideOnHover | Sets hideOnHover. |
| init | Initializes the DOM nodes required for this tooltip handler. |
| getStateForEvent | Returns the mxCellState to be used for showing a tooltip for this event. |
| mouseDown | Handles the event by initiating a rubberband selection. |
| mouseMove | Handles the event by updating the rubberband selection. |
| mouseUp | Handles the event by resetting the tooltip timer or hiding the existing tooltip. |
| resetTimer | Resets the timer. |
| reset | Resets and/or restarts the timer to trigger the display of the tooltip. |
| hide | Hides the tooltip and resets the timer. |
| hideTooltip | Hides the tooltip. |
| show | Shows the tooltip for the specified cell and optional index at the specified location (with a vertical offset of 10 pixels). |
| destroy | Destroys the handler and all its resources and DOM nodes. |
function mxTooltipHandler( graph, delay )
Constructs an event handler that displays tooltips with the specified delay (in milliseconds). If no delay is specified then a default delay of 500 ms (0.5 sec) is used.
| graph | Reference to the enclosing mxGraph. |
| delay | Optional delay in milliseconds. |
mxTooltipHandler.prototype.graph
Reference to the enclosing mxGraph.
mxTooltipHandler.prototype.destroyed
True if this handler was destroyed using destroy.
mxTooltipHandler.prototype.isEnabled = function()
Returns true if events are handled. This implementation returns enabled.
mxTooltipHandler.prototype.setEnabled = function( enabled )
Enables or disables event handling. This implementation updates enabled.
mxTooltipHandler.prototype.isHideOnHover = function()
Returns hideOnHover.
mxTooltipHandler.prototype.setHideOnHover = function( value )
Sets hideOnHover.
mxTooltipHandler.prototype.getStateForEvent = function( me )
Returns the mxCellState to be used for showing a tooltip for this event.
Event handler that highlights cells. Inherits from mxCellMarker.
new mxCellTracker(graph, '#00FF00');
For detecting dragEnter, dragOver and dragLeave on cells, the following code can be used:
graph.addMouseListener(
{
cell: null,
mouseDown: function(sender, me) { },
mouseMove: function(sender, me)
{
var tmp = me.getCell();
if (tmp != this.cell)
{
if (this.cell != null)
{
this.dragLeave(me.getEvent(), this.cell);
}
this.cell = tmp;
if (this.cell != null)
{
this.dragEnter(me.getEvent(), this.cell);
}
}
if (this.cell != null)
{
this.dragOver(me.getEvent(), this.cell);
}
},
mouseUp: function(sender, me) { },
dragEnter: function(evt, cell)
{
mxLog.debug('dragEnter', cell.value);
},
dragOver: function(evt, cell)
{
mxLog.debug('dragOver', cell.value);
},
dragLeave: function(evt, cell)
{
mxLog.debug('dragLeave', cell.value);
}
});| Functions | |
| mxCellTracker | Constructs an event handler that highlights cells. |
| mouseDown | Ignores the event. |
| mouseMove | Handles the event by highlighting the cell under the mousepointer if it is over the hotspot region of the cell. |
| mouseUp | Handles the event by reseting the highlight. |
| destroy | Destroys the object and all its resources and DOM nodes. |
function mxCellTracker( graph, color, funct )
Constructs an event handler that highlights cells.
| graph | Reference to the enclosing mxGraph. |
| color | Color of the highlight. Default is blue. |
| funct | Optional JavaScript function that is used to override mxCellMarker.getCell. |
A helper class to highlight cells. Here is an example for a given cell.
var highlight = new mxCellHighlight(graph, '#ff0000', 2); highlight.highlight(graph.view.getState(cell)));
| Functions | |
| mxCellHighlight | Constructs a cell highlight. |
| Variables | |
| keepOnTop | Specifies if the highlights should appear on top of everything else in the overlay pane. |
| graph | Reference to the enclosing mxGraph. |
| state | Reference to the mxCellState. |
| spacing | Specifies the spacing between the highlight for vertices and the vertex. |
| resetHandler | Holds the handler that automatically invokes reset if the highlight should be hidden. |
| Functions | |
| setHighlightColor | Sets the color of the rectangle used to highlight drop targets. |
| drawHighlight | Creates and returns the highlight shape for the given state. |
| createShape | Creates and returns the highlight shape for the given state. |
| repaint | Updates the highlight after a change of the model or view. |
| repaint | Updates the highlight after a change of the model or view. |
| hide | Resets the state of the cell marker. |
| mark | Marks the <markedState> and fires a mark event. |
| isHighlightAt | Returns true if this highlight is at the given position. |
| destroy | Destroys the handler and all its resources and DOM nodes. |
mxCellHighlight.prototype.graph
Reference to the enclosing mxGraph.
mxCellHighlight.prototype.state
Reference to the mxCellState.
Marks the <markedState> and fires a mark event.
Binds keycodes to actionnames in an editor. This aggregates an internal handler and extends the implementation of mxKeyHandler.escape to not only cancel the editing, but also hide the properties dialog and fire an <mxEditor.escape> event via editor. An instance of this class is created by mxEditor and stored in mxEditor.keyHandler.
Bind the delete key to the delete action in an existing editor.
var keyHandler = new mxDefaultKeyHandler(editor); keyHandler.bindAction(46, 'delete');
This class uses the mxDefaultKeyHandlerCodec to read configuration data into an existing instance. See mxDefaultKeyHandlerCodec for a description of the configuration format.
See mxKeyHandler.
An mxEvent.ESCAPE event is fired via the editor if the escape key is pressed.
| Functions | |
| mxDefaultKeyHandler | Constructs a new default key handler for the mxEditor.graph in the given mxEditor. |
| Variables | |
| editor | Reference to the enclosing mxEditor. |
| handler | Holds the mxKeyHandler for key event handling. |
| Functions | |
| bindAction | Binds the specified keycode to the given action in editor. |
| destroy | Destroys the handler associated with this object. |
function mxDefaultKeyHandler( editor )
Constructs a new default key handler for the mxEditor.graph in the given mxEditor. (The editor may be null if a prototypical instance for a mxDefaultKeyHandlerCodec is created.)
| editor | Reference to the enclosing mxEditor. |
mxDefaultKeyHandler.prototype.editor
Reference to the enclosing mxEditor.
mxDefaultKeyHandler.prototype.handler
Holds the mxKeyHandler for key event handling.
mxDefaultKeyHandler.prototype.bindAction = function ( code, action, control )
Binds the specified keycode to the given action in editor. The optional control flag specifies if the control key must be pressed to trigger the action.
| code | Integer that specifies the keycode. |
| action | Name of the action to execute in editor. |
| control | Optional boolean that specifies if control must be pressed. Default is false. |
Creates popupmenus for mouse events. This object holds an XML node which is a description of the popup menu to be created. In createMenu, the configuration is applied to the context and the resulting menu items are added to the menu dynamically. See createMenu for a description of the configuration format.
This class does not create the DOM nodes required for the popup menu, it only parses an XML description to invoke the respective methods on an mxPopupMenu each time the menu is displayed.
This class uses the mxDefaultPopupMenuCodec to read configuration data into an existing instance, however, the actual parsing is done by this class during program execution, so the format is described below.
| Functions | |
| mxDefaultPopupMenu | Constructs a new popupmenu-factory based on given configuration. |
| Variables | |
| imageBasePath | Base path for all icon attributes in the config. |
| config | XML node used as the description of new menu items. |
| Functions | |
| createMenu | This function is called from mxEditor to add items to the given menu based on config. |
| addItems | Recursively adds the given items and all of its children into the given menu. |
| addAction | Helper method to bind an action to a new menu item. |
| createConditions | Evaluates the default conditions for the given context. |
mxDefaultPopupMenu.prototype.config
XML node used as the description of new menu items. This node is used in createMenu to dynamically create the menu items if their respective conditions evaluate to true for the given arguments.
mxDefaultPopupMenu.prototype.createMenu = function( editor, menu, cell, evt )
This function is called from mxEditor to add items to the given menu based on config. The config is a sequence of the following nodes and attributes.
| add | Adds a new menu item. See below for attributes. |
| separator | Adds a separator. No attributes. |
| condition | Adds a custom condition. Name attribute. |
The add-node may have a child node that defines a function to be invoked before the action is executed (or instead of an action to be executed).
| as | Resource key for the label (needs entry in property file). |
| action | Name of the action to execute in enclosing editor. |
| icon | Optional icon (relative/absolute URL). |
| iconCls | Optional CSS class for the icon. |
| if | Optional name of condition that must be true (see below). |
| enabled-if | Optional name of condition that specifies if the menu item should be enabled. |
| name | Name of custom condition. Only for condition nodes. |
| nocell | No cell under the mouse. |
| ncells | More than one cell selected. |
| notRoot | Drilling position is other than home. |
| cell | Cell under the mouse. |
| notEmpty | Exactly one cell with children under mouse. |
| expandable | Exactly one expandable cell under mouse. |
| collapsable | Exactly one collapsable cell under mouse. |
| validRoot | Exactly one cell which is a possible root under mouse. |
| swimlane | Exactly one cell which is a swimlane under mouse. |
<mxDefaultPopupMenu as="popupHandler"> <add as="delete" action="delete" icon="images/delete.gif" if="cell"/> </mxDefaultPopupMenu>
<mxDefaultPopupMenu as="popupHandler">
<add as="action1"><![CDATA[
function (editor, cell, evt)
{
editor.execute('action1', cell, 'myArg');
}
]]></add>
</mxDefaultPopupMenu>The above example invokes action1 with an additional third argument via the editor instance. The third argument is passed to the function that defines action1. If the add-node has no action-attribute, then only the function defined in the text content is executed, otherwise first the function and then the action defined in the action-attribute is executed. The function in the text content has 3 arguments, namely the mxEditor instance, the mxCell instance under the mouse, and the native mouse event.
<condition name="condition1"><![CDATA[
function (editor, cell, evt)
{
return cell != null;
}
]]></condition><add as="action1" action="action1" icon="action1.gif" if="condition1"/>
The order in which the items and conditions appear is not significant as all connditions are evaluated before any items are created.
| editor | Enclosing mxEditor instance. |
| menu | mxPopupMenu that is used for adding items and separators. |
| cell | Optional mxCell which is under the mousepointer. |
| evt | Optional mouse event which triggered the menu. |
mxDefaultPopupMenu.prototype.addItems = function( editor, menu, cell, evt, conditions, item, parent )
Recursively adds the given items and all of its children into the given menu.
| editor | Enclosing mxEditor instance. |
| menu | mxPopupMenu that is used for adding items and separators. |
| cell | Optional mxCell which is under the mousepointer. |
| evt | Optional mouse event which triggered the menu. |
| conditions | Array of names boolean conditions. |
| item | XML node that represents the current menu item. |
| parent | DOM node that represents the parent menu item. |
mxDefaultPopupMenu.prototype.addAction = function( menu, editor, lab, icon, funct, action, cell, parent, iconCls, enabled )
Helper method to bind an action to a new menu item.
| menu | mxPopupMenu that is used for adding items and separators. |
| editor | Enclosing mxEditor instance. |
| lab | String that represents the label of the menu item. |
| icon | Optional URL that represents the icon of the menu item. |
| action | Optional name of the action to execute in the given editor. |
| funct | Optional function to execute before the optional action. The function takes an mxEditor, the mxCell under the mouse and the mouse event that triggered the call. |
| cell | Optional mxCell to use as an argument for the action. |
| parent | DOM node that represents the parent menu item. |
| iconCls | Optional CSS class for the menu icon. |
| enabled | Optional boolean that specifies if the menu item is enabled. Default is true. |
Toolbar for the editor. This modifies the state of the graph or inserts new cells upon mouse clicks.
Create a toolbar with a button to copy the selection into the clipboard, and a combo box with one action to paste the selection from the clipboard into the graph.
var toolbar = new mxDefaultToolbar(container, editor);
toolbar.addItem('Copy', null, 'copy');
var combo = toolbar.addActionCombo('More actions...');
toolbar.addActionOption(combo, 'Paste', 'paste');This class uses the mxDefaultToolbarCodec to read configuration data into an existing instance. See mxDefaultToolbarCodec for a description of the configuration format.
| Functions | |
| mxDefaultToolbar | Constructs a new toolbar for the given container and editor. |
| Variables | |
| editor | Reference to the enclosing mxEditor. |
| toolbar | Holds the internal mxToolbar. |
| resetHandler | Reference to the function used to reset the toolbar. |
| spacing | Defines the spacing between existing and new vertices in gridSize units when a new vertex is dropped on an existing cell. |
| connectOnDrop | Specifies if elements should be connected if new cells are dropped onto connectable elements. |
| init | Constructs the toolbar for the given container and installs a listener that updates the mxEditor.insertFunction on editor if an item is selected in the toolbar. |
| Functions | |
| addItem | Adds a new item that executes the given action in editor. |
| addSeparator | Adds a vertical separator using the optional icon. |
| addCombo | Helper method to invoke mxToolbar.addCombo on toolbar and return the resulting DOM node. |
| addActionCombo | Helper method to invoke <mxToolbar.addActionCombo> on toolbar using the given title and return the resulting DOM node. |
| addActionOption | Binds the given action to a option with the specified label in the given combo. |
| addOption | Helper method to invoke mxToolbar.addOption on toolbar and return the resulting DOM node that represents the option. |
| addMode | Creates an item for selecting the given mode in the editor’s graph. |
| addPrototype | Creates an item for inserting a clone of the specified prototype cell into the editor’s graph. |
| drop | Handles a drop from a toolbar item to the graph. |
| insert | Handles a drop by inserting the given vertex into the given parent cell or the default parent if no parent is specified. |
| connect | Handles a drop by connecting the given vertex to the given source cell. |
| installDropHandler | Makes the given img draggable using the given function for handling a drop event. |
| destroy | Destroys the toolbar associated with this object and removes all installed listeners. |
function mxDefaultToolbar( container, editor )
Constructs a new toolbar for the given container and editor. The container and editor may be null if a prototypical instance for a mxDefaultKeyHandlerCodec is created.
| container | DOM node that contains the toolbar. |
| editor | Reference to the enclosing mxEditor. |
mxDefaultToolbar.prototype.editor
Reference to the enclosing mxEditor.
mxDefaultToolbar.prototype.toolbar
Holds the internal mxToolbar.
mxDefaultToolbar.prototype.resetHandler
Reference to the function used to reset the toolbar.
mxDefaultToolbar.prototype.init
Constructs the toolbar for the given container and installs a listener that updates the mxEditor.insertFunction on editor if an item is selected in the toolbar. This assumes that editor is not null.
| container | DOM node that contains the toolbar. |
mxDefaultToolbar.prototype.addItem = function( title, icon, action, pressed )
Adds a new item that executes the given action in editor. The title, icon and pressedIcon are used to display the toolbar item.
| title | String that represents the title (tooltip) for the item. |
| icon | URL of the icon to be used for displaying the item. |
| action | Name of the action to execute when the item is clicked. |
| pressed | Optional URL of the icon for the pressed state. |
mxDefaultToolbar.prototype.addSeparator = function( icon )
Adds a vertical separator using the optional icon.
| icon | Optional URL of the icon that represents the vertical separator. Default is mxClient.imageBasePath + ‘/separator.gif’. |
mxDefaultToolbar.prototype.addCombo = function()
Helper method to invoke mxToolbar.addCombo on toolbar and return the resulting DOM node.
mxDefaultToolbar.prototype.addActionCombo = function( title )
Helper method to invoke <mxToolbar.addActionCombo> on toolbar using the given title and return the resulting DOM node.
| title | String that represents the title of the combo. |
mxDefaultToolbar.prototype.addActionOption = function( combo, title, action )
Binds the given action to a option with the specified label in the given combo. Combo is an object returned from an earlier call to addCombo or addActionCombo.
| combo | DOM node that represents the combo box. |
| title | String that represents the title of the combo. |
| action | Name of the action to execute in editor. |
mxDefaultToolbar.prototype.addOption = function( combo, title, value )
Helper method to invoke mxToolbar.addOption on toolbar and return the resulting DOM node that represents the option.
| combo | DOM node that represents the combo box. |
| title | String that represents the title of the combo. |
| value | Object that represents the value of the option. |
mxDefaultToolbar.prototype.addMode = function( title, icon, mode, pressed, funct )
Creates an item for selecting the given mode in the editor’s graph. Supported modenames are select, connect and pan.
| title | String that represents the title of the item. |
| icon | URL of the icon that represents the item. |
| mode | String that represents the mode name to be used in mxEditor.setMode. |
| pressed | Optional URL of the icon that represents the pressed state. |
| funct | Optional JavaScript function that takes the mxEditor as the first and only argument that is executed after the mode has been selected. |
mxDefaultToolbar.prototype.addPrototype = function( title, icon, ptype, pressed, insert, toggle )
Creates an item for inserting a clone of the specified prototype cell into the editor’s graph. The ptype may either be a cell or a function that returns a cell.
| title | String that represents the title of the item. |
| icon | URL of the icon that represents the item. |
| ptype | Function or object that represents the prototype cell. If ptype is a function then it is invoked with no arguments to create new instances. |
| pressed | Optional URL of the icon that represents the pressed state. |
| insert | Optional JavaScript function that handles an insert of the new cell. This function takes the mxEditor, new cell to be inserted, mouse event and optional mxCell under the mouse pointer as arguments. |
| toggle | Optional boolean that specifies if the item can be toggled. Default is true. |
mxDefaultToolbar.prototype.drop = function( vertex, evt, target )
Handles a drop from a toolbar item to the graph. The given vertex represents the new cell to be inserted. This invokes insert or connect depending on the given target cell.
| vertex | mxCell to be inserted. |
| evt | Mouse event that represents the drop. |
| target | Optional mxCell that represents the drop target. |
mxDefaultToolbar.prototype.insert = function( vertex, evt, target )
Handles a drop by inserting the given vertex into the given parent cell or the default parent if no parent is specified.
| vertex | mxCell to be inserted. |
| evt | Mouse event that represents the drop. |
| parent | Optional mxCell that represents the parent. |
Extends mxEventSource to implement a application wrapper for a graph that adds actions, I/O using mxCodec, auto-layout using mxLayoutManager, command history using undoManager, and standard dialogs and widgets, eg. properties, help, outline, toolbar, and popupmenu. It also adds templates to be used as cells in toolbars, auto-validation using the <validation> flag, attribute cycling using cycleAttributeValues, higher-level events such as <root>, and backend integration using urlPost and urlImage.
Actions are functions stored in the actions array under their names. The functions take the mxEditor as the first, and an optional mxCell as the second argument and are invoked using execute. Any additional arguments passed to execute are passed on to the action as-is.
A list of built-in actions is available in the addActions description.
To read a diagram from an XML string, for example from a textfield within the page, the following code is used:
var doc = mxUtils.parseXML(xmlString); var node = doc.documentElement; editor.readGraphModel(node);
For reading a diagram from a remote location, use the open method.
To save diagrams in XML on a server, you can set the urlPost variable. This variable will be used in getUrlPost to construct a URL for the post request that is issued in the save method. The post request contains the XML representation of the diagram as returned by writeGraphModel in the xml parameter.
On the server side, the post request is processed using standard technologies such as Java Servlets, CGI, .NET or ASP.
Here are some examples of processing a post request in various languages.
Note that the linefeeds should only be replaced if the XML is processed in Java, for example when creating an image, but not if the XML is passed back to the client-side.
A backend (Java, PHP or C#) is required for creating images. The distribution contains an example for each backend (ImageHandler.java, ImageHandler.cs and graph.php). More information about using a backend to create images can be found in the readme.html files. Note that the preview is implemented using VML/SVG in the browser and does not require a backend. The backend is only required to creates images (bitmaps).
Note There are five characters that should always appear in XML content as escapes, so that they do not interact with the syntax of the markup. These are part of the language for all documents based on XML and for HTML.
Although it is part of the XML language, ' is not defined in HTML. For this reason the XHTML specification recommends instead the use of ' if text may be passed to a HTML user agent.
If you are having problems with special characters on the server-side then you may want to try the escapePostData flag.
For converting decimal escape sequences inside strings, a user has provided us with the following function:
function html2js(text)
{
var entitySearch = /&#[0-9]+;/;
var entity;
while (entity = entitySearch.exec(text))
{
var charCode = entity[0].substring(2, entity[0].length -1);
text = text.substring(0, entity.index)
+ String.fromCharCode(charCode)
+ text.substring(entity.index + entity[0].length);
}
return text;
}Otherwise try using hex escape sequences and the built-in unescape function for converting such strings.
For saving and opening local files, no standardized method exists that works across all browsers. The recommended way of dealing with local files is to create a backend that streams the XML data back to the browser (echo) as an attachment so that a Save-dialog is displayed on the client-side and the file can be saved to the local disk.
For example, in PHP the code that does this looks as follows.
$xml = stripslashes($_POST["xml"]);
header("Content-Disposition: attachment; filename=\"diagram.xml\"");
echo($xml);To open a local file, the file should be uploaded via a form in the browser and then opened from the server in the editor.
The properties displayed in the properties dialog are the attributes and values of the cell’s user object, which is an XML node. The XML node is defined in the templates section of the config file.
The templates are stored in mxEditor.templates and contain cells which are cloned at insertion time to create new vertices by use of drag and drop from the toolbar. Each entry in the toolbar for adding a new vertex must refer to an existing template.
In the following example, the task node is a business object and only the mxCell node and its mxGeometry child contain graph information:
<Task label="Task" description="">
<mxCell vertex="true">
<mxGeometry as="geometry" width="72" height="32"/>
</mxCell>
</Task>The idea is that the XML representation is inverse from the in-memory representation: The outer XML node is the user object and the inner node is the cell. This means the user object of the cell is the Task node with no children for the above example:
<Task label="Task" description=""/>
The Task node can have any tag name, attributes and child nodes. The mxCodec will use the XML hierarchy as the user object, while removing the “known annotations”, such as the mxCell node. At save-time the cell data will be “merged” back into the user object. The user object is only modified via the properties dialog during the lifecycle of the cell.
In the default implementation of createProperties, the user object’s attributes are put into a form for editing. Attributes are changed using the mxCellAttributeChange action in the model. The dialog can be replaced by overriding the createProperties hook or by replacing the showProperties action in actions. Alternatively, the entry in the config file’s popupmenu section can be modified to invoke a different action.
If you want to displey the properties dialog on a doubleclick, you can set mxEditor.dblClickAction to showProperties as follows:
editor.dblClickAction = 'showProperties';
The toolbar and popupmenu are typically configured using the respective sections in the config file, that is, the popupmenu is defined as follows:
<mxEditor>
<mxDefaultPopupMenu as="popupHandler">
<add as="cut" action="cut" icon="images/cut.gif"/>
...New entries can be added to the toolbar by inserting an add-node into the above configuration. Existing entries may be removed and changed by modifying or removing the respective entries in the configuration. The configuration is read by the mxDefaultPopupMenuCodec, the format of the configuration is explained in <mxDefaultPopupMenu.decode>.
The toolbar is defined in the mxDefaultToolbar section. Items can be added and removed in this section.
<mxEditor>
<mxDefaultToolbar>
<add as="save" action="save" icon="images/save.gif"/>
<add as="Swimlane" template="swimlane" icon="images/swimlane.gif"/>
...The format of the configuration is described in mxDefaultToolbarCodec.decode.
For the IDs, there is an implicit behaviour in mxCodec: It moves the Id from the cell to the user object at encoding time and vice versa at decoding time. For example, if the Task node from above has an id attribute, then the mxCell.id of the corresponding cell will have this value. If there is no Id collision in the model, then the cell may be retrieved using this Id with the mxGraphModel.getCell function. If there is a collision, a new Id will be created for the cell using mxGraphModel.createId. At encoding time, this new Id will replace the value previously stored under the id attribute in the Task node.
See mxEditorCodec, mxDefaultToolbarCodec and mxDefaultPopupMenuCodec for information about configuring the editor and user interface.
For inserting a new cell, say, by clicking a button in the document, the following code can be used. This requires an reference to the editor.
var userObject = new Object();
var parent = editor.graph.getDefaultParent();
var model = editor.graph.model;
model.beginUpdate();
try
{
editor.graph.insertVertex(parent, null, userObject, 20, 20, 80, 30);
}
finally
{
model.endUpdate();
}If a template cell from the config file should be inserted, then a clone of the template can be created as follows. The clone is then inserted using the add function instead of addVertex.
var template = editor.templates['task']; var clone = editor.graph.model.cloneCell(template);
| resources/editor | Language resources for mxEditor |
| onInit | Called from within the constructor. |
| mxgraph=seen | Set when the editor is started. |
| mxEvent.OPEN | Fires after a file was opened in open. |
| mxEvent.SAVE | Fires after the current file was saved in save. |
| mxEvent.POST | Fires if a successful response was received in postDiagram. |
| mxEvent.ROOT | Fires when the current root has changed, or when the title of the current root has changed. |
| mxEvent. | Fires before a vertex is added in addVertex. |
| mxEvent. | Fires between begin- and endUpdate in addVertex. |
| mxEvent. | Fires after a vertex was inserted and selected in addVertex. |
| mxEvent. | Fires when the escape key is pressed. |
| mxEditor | Constructs a new editor. |
| Controls and Handlers | |
| askZoomResource | Specifies the resource key for the zoom dialog. |
| lastSavedResource | Specifies the resource key for the last saved info. |
| currentFileResource | Specifies the resource key for the current file info. |
| propertiesResource | Specifies the resource key for the properties window title. |
| tasksResource | Specifies the resource key for the tasks window title. |
| helpResource | Specifies the resource key for the help window title. |
| outlineResource | Specifies the resource key for the outline window title. |
| outline | Reference to the mxWindow that contains the outline. |
| graph | Holds a mxGraph for displaying the diagram. |
| graphRenderHint | Holds the render hint used for creating the graph in setGraphContainer. |
| toolbar | Holds a mxDefaultToolbar for displaying the toolbar. |
| status | DOM container that holds the statusbar. |
| popupHandler | Holds a mxDefaultPopupMenu for displaying popupmenus. |
| undoManager | Holds an mxUndoManager for the command history. |
| keyHandler | Holds a mxDefaultKeyHandler for handling keyboard events. |
| Actions and Options | |
| actions | Maps from actionnames to actions, which are functions taking the editor and the cell as arguments. |
| dblClickAction | Specifies the name of the action to be executed when a cell is double clicked. |
| swimlaneRequired | Specifies if new cells must be inserted into an existing swimlane. |
| disableContextMenu | Specifies if the context menu should be disabled in the graph container. |
| Templates | |
| insertFunction | Specifies the function to be used for inserting new cells into the graph. |
| forcedInserting | Specifies if a new cell should be inserted on a single click even using insertFunction if there is a cell under the mousepointer, otherwise the cell under the mousepointer is selected. |
| templates | Maps from names to protoype cells to be used in the toolbar for inserting new cells into the diagram. |
| defaultEdge | Prototype edge cell that is used for creating new edges. |
| defaultEdgeStyle | Specifies the edge style to be returned in getEdgeStyle. |
| defaultGroup | Prototype group cell that is used for creating new groups. |
| groupBorderSize | Default size for the border of new groups. |
| Backend Integration | |
| filename | Contains the URL of the last opened file as a string. |
| lineFeed | Character to be used for encoding linefeeds in save. |
| postParameterName | Specifies if the name of the post parameter that contains the diagram data in a post request to the server. |
| escapePostData | Specifies if the data in the post request for saving a diagram should be converted using encodeURIComponent. |
| urlPost | Specifies the URL to be used for posting the diagram to a backend in save. |
| urlImage | Specifies the URL to be used for creating a bitmap of the graph in the image action. |
| Autolayout | |
| horizontalFlow | Specifies the direction of the flow in the diagram. |
| layoutDiagram | Specifies if the top-level elements in the diagram should be layed out using a vertical or horizontal stack depending on the setting of horizontalFlow. |
| swimlaneSpacing | Specifies the spacing between swimlanes if automatic layout is turned on in layoutDiagram. |
| maintainSwimlanes | Specifies if the swimlanes should be kept at the same width or height depending on the setting of horizontalFlow. |
| layoutSwimlanes | Specifies if the children of swimlanes should be layed out, either vertically or horizontally depending on horizontalFlow. |
| Attribute Cycling | |
| cycleAttributeValues | Specifies the attribute values to be cycled when inserting new swimlanes. |
| cycleAttributeIndex | Index of the last consumed attribute index. |
| cycleAttributeName | Name of the attribute to be assigned a cycleAttributeValues when inserting new swimlanes. |
| Windows | |
| tasks | Holds the mxWindow created in showTasks. |
| tasksWindowImage | Icon for the tasks window. |
| tasksTop | Specifies the top coordinate of the tasks window in pixels. |
| help | Holds the mxWindow created in showHelp. |
| helpWindowImage | Icon for the help window. |
| urlHelp | Specifies the URL to be used for the contents of the Online Help window. |
| helpWidth | Specifies the width of the help window in pixels. |
| helpHeight | Specifies the height of the help window in pixels. |
| propertiesWidth | Specifies the width of the properties window in pixels. |
| propertiesHeight | Specifies the height of the properties window in pixels. |
| movePropertiesDialog | Specifies if the properties dialog should be automatically moved near the cell it is displayed for, otherwise the dialog is not moved. |
| validating | Specifies if mxGraph.validateGraph should automatically be invoked after each change. |
| modified | True if the graph has been modified since it was last saved. |
| isModified | Returns modified. |
| setModified | Sets modified to the specified boolean value. |
| addActions | Adds the built-in actions to the editor instance. |
| configure | Configures the editor using the specified node. |
| resetFirstTime | Resets the cookie that is used to remember if the editor has already been used. |
| resetHistory | Resets the command history, modified state and counters. |
| addAction | Binds the specified actionname to the specified function. |
| execute | Executes the function with the given name in actions passing the editor instance and given cell as the first and second argument. |
| addTemplate | Adds the specified template under the given name in templates. |
| getTemplate | Returns the template for the given name. |
| createGraph | Creates the graph for the editor. |
| createSwimlaneManager | Sets the graph’s container using mxGraph.init. |
| createLayoutManager | Creates a layout manager for the swimlane and diagram layouts, that is, the locally defined inter- and intraswimlane layouts. |
| setGraphContainer | Sets the graph’s container using mxGraph.init. |
| installDblClickHandler | Overrides mxGraph.dblClick to invoke dblClickAction on a cell and reset the selection tool in the toolbar. |
| installUndoHandler | Adds the undoManager to the graph model and the view. |
| installDrillHandler | Installs listeners for dispatching the <root> event. |
| installChangeHandler | Installs the listeners required to automatically validate the graph. |
| installInsertHandler | Installs the handler for invoking insertFunction if one is defined. |
| createDiagramLayout | Creates the layout instance used to layout the swimlanes in the diagram. |
| createSwimlaneLayout | Creates the layout instance used to layout the children of each swimlane. |
| createToolbar | Creates the toolbar with no container. |
| setToolbarContainer | Initializes the toolbar for the given container. |
| setStatusContainer | Creates the status using the specified container. |
| setStatus | Display the specified message in the status bar. |
| setTitleContainer | Creates a listener to update the inner HTML of the specified DOM node with the value of getTitle. |
| treeLayout | Executes a vertical or horizontal compact tree layout using the specified cell as an argument. |
| getTitle | Returns the string value for the current root of the diagram. |
| getRootTitle | Returns the string value of the root cell in mxGraph.model. |
| undo | Undo the last change in graph. |
| redo | Redo the last change in graph. |
| groupCells | Invokes createGroup to create a new group cell and the invokes mxGraph.groupCells, using the grid size of the graph as the spacing in the group’s content area. |
| createGroup | Creates and returns a clone of defaultGroup to be used as a new group cell in <group>. |
| open | Opens the specified file synchronously and parses it using readGraphModel. |
| readGraphModel | Reads the specified XML node into the existing graph model and resets the command history and modified state. |
| save | Posts the string returned by writeGraphModel to the given URL or the URL returned by getUrlPost. |
| postDiagram | Hook for subclassers to override the posting of a diagram represented by the given node to the given URL. |
| writeGraphModel | Hook to create the string representation of the diagram. |
| getUrlPost | Returns the URL to post the diagram to. |
| getUrlImage | Returns the URL to create the image with. |
| swapStyles | Swaps the styles for the given names in the graph’s stylesheet and refreshes the graph. |
| showProperties | Creates and shows the properties dialog for the given cell. |
| isPropertiesVisible | Returns true if the properties dialog is currently visible. |
| createProperties | Creates and returns the DOM node that represents the contents of the properties dialog for the given cell. |
| hideProperties | Hides the properties dialog. |
| showTasks | Shows the tasks window. |
| refreshTasks | Updates the contents of the tasks window using createTasks. |
| createTasks | Updates the contents of the given DOM node to display the tasks associated with the current editor state. |
| showHelp | Shows the help window. |
| showOutline | Shows the outline window. |
| setMode | Puts the graph into the specified mode. |
| createPopupMenu | Uses popupHandler to create the menu in the graph’s panning handler. |
| createEdge | Uses defaultEdge as the prototype for creating new edges in the connection handler of the graph. |
| getEdgeStyle | Returns a string identifying the style of new edges. |
| consumeCycleAttribute | Returns the next attribute in cycleAttributeValues or null, if not attribute should be used in the specified cell. |
| cycleAttribute | Uses the returned value from consumeCycleAttribute as the value for the cycleAttributeName key in the given cell’s style. |
| addVertex | Adds the given vertex as a child of parent at the specified x and y coordinate and fires an addVertex event. |
| destroy | Removes the editor and all its associated resources. |
Set when the editor is started. Never expires. Use resetFirstTime to reset this cookie. This cookie only exists if onInit is implemented.
Fires after the current file was saved in save. The <code>url</code> property contains the URL that was used for saving.
Fires if a successful response was received in postDiagram. The <code>request</code> property contains the mxXmlRequest, the <code>url</code> and <code>data</code> properties contain the URL and the data that were used in the post request.
Fires before a vertex is added in addVertex. The <code>vertex</code> property contains the new vertex and the <code>parent</code> property contains its parent.
Fires between begin- and endUpdate in addVertex. The <code>vertex</code> property contains the vertex that is being inserted.
Fires after a vertex was inserted and selected in addVertex. The <code>vertex</code> property contains the new vertex.
For starting an in-place edit after a new vertex has been added to the graph, the following code can be used.
editor.addListener(mxEvent.AFTER_ADD_VERTEX, function(sender, evt)
{
var vertex = evt.getProperty('vertex');
if (editor.graph.isCellEditable(vertex))
{
editor.graph.startEditingAtCell(vertex);
}
});
function mxEditor( config )
Constructs a new editor. This function invokes the onInit callback upon completion.
var config = mxUtils.load('config/diagrameditor.xml').getDocumentElement();
var editor = new mxEditor(config);| config | Optional XML node that contains the configuration. |
mxEditor.prototype.graph
Holds a mxGraph for displaying the diagram. The graph is created in setGraphContainer.
mxEditor.prototype.graphRenderHint
Holds the render hint used for creating the graph in setGraphContainer. See mxGraph. Default is null.
mxEditor.prototype.toolbar
Holds a mxDefaultToolbar for displaying the toolbar. The toolbar is created in setToolbarContainer.
mxEditor.prototype.status
DOM container that holds the statusbar. Default is null. Use setStatusContainer to set this value.
mxEditor.prototype.popupHandler
Holds a mxDefaultPopupMenu for displaying popupmenus.
mxEditor.prototype.undoManager
Holds an mxUndoManager for the command history.
mxEditor.prototype.keyHandler
Holds a mxDefaultKeyHandler for handling keyboard events. The handler is created in setGraphContainer.
mxEditor.prototype.dblClickAction
Specifies the name of the action to be executed when a cell is double clicked. Default is edit.
To handle a singleclick, use the following code.
editor.graph.addListener(mxEvent.CLICK, function(sender, evt)
{
var e = evt.getProperty('event');
var cell = evt.getProperty('cell');
if (cell != null && !e.isConsumed())
{
// Do something useful with cell...
e.consume();
}
});
mxEditor.prototype.insertFunction
Specifies the function to be used for inserting new cells into the graph. This is assigned from the mxDefaultToolbar if a vertex-tool is clicked.
mxEditor.prototype.forcedInserting
Specifies if a new cell should be inserted on a single click even using insertFunction if there is a cell under the mousepointer, otherwise the cell under the mousepointer is selected. Default is false.
mxEditor.prototype.defaultEdgeStyle
Specifies the edge style to be returned in getEdgeStyle. Default is null.
mxEditor.prototype.groupBorderSize
Default size for the border of new groups. If null, then then mxGraph.gridSize is used. Default is null.
Character to be used for encoding linefeeds in save. Default is ‘
’.
mxEditor.prototype.urlPost
Specifies the URL to be used for posting the diagram to a backend in save.
mxEditor.prototype.layoutDiagram
Specifies if the top-level elements in the diagram should be layed out using a vertical or horizontal stack depending on the setting of horizontalFlow. The spacing between the swimlanes is specified by swimlaneSpacing. Default is false.
If the top-level elements are swimlanes, then the intra-swimlane layout is activated by the layoutSwimlanes switch.
mxEditor.prototype.swimlaneSpacing
Specifies the spacing between swimlanes if automatic layout is turned on in layoutDiagram. Default is 0.
mxEditor.prototype.maintainSwimlanes
Specifies if the swimlanes should be kept at the same width or height depending on the setting of horizontalFlow. Default is false.
For horizontal flows, all swimlanes have the same height and for vertical flows, all swimlanes have the same width. Furthermore, the swimlanes are automatically “stacked” if layoutDiagram is true.
mxEditor.prototype.layoutSwimlanes
Specifies if the children of swimlanes should be layed out, either vertically or horizontally depending on horizontalFlow. Default is false.
mxEditor.prototype.cycleAttributeIndex
Index of the last consumed attribute index. If a new swimlane is inserted, then the cycleAttributeValues at this index will be used as the value for cycleAttributeName. Default is 0.
mxEditor.prototype.cycleAttributeName
Name of the attribute to be assigned a cycleAttributeValues when inserting new swimlanes. Default is fillColor.
mxEditor.prototype.validating
Specifies if mxGraph.validateGraph should automatically be invoked after each change. Default is false.
mxEditor.prototype.isModified = function ()
Returns modified.
mxEditor.prototype.setModified = function ( value )
Sets modified to the specified boolean value.
mxEditor.prototype.addActions = function ()
Adds the built-in actions to the editor instance.
| save | Saves the graph using urlPost. |
| Shows the graph in a new print preview window. | |
| show | Shows the graph in a new window. |
| exportImage | Shows the graph as a bitmap image using getUrlImage. |
| refresh | Refreshes the graph’s display. |
| cut | Copies the current selection into the clipboard and removes it from the graph. |
| copy | Copies the current selection into the clipboard. |
| paste | Pastes the clipboard into the graph. |
| delete | Removes the current selection from the graph. |
| group | Puts the current selection into a new group. |
| ungroup | Removes the selected groups and selects the children. |
| undo | Undoes the last change on the graph model. |
| redo | Redoes the last change on the graph model. |
| zoom | Sets the zoom via a dialog. |
| zoomIn | Zooms into the graph. |
| zoomOut | Zooms out of the graph |
| actualSize | Resets the scale and translation on the graph. |
| fit | Changes the scale so that the graph fits into the window. |
| showProperties | Shows the properties dialog. |
| selectAll | Selects all cells. |
| selectNone | Clears the selection. |
| selectVertices | Selects all vertices. selectEdges = Selects all edges. |
| edit | Starts editing the current selection cell. |
| enterGroup | Drills down into the current selection cell. |
| exitGroup | Moves up in the drilling hierachy |
| home | Moves to the topmost parent in the drilling hierarchy |
| selectPrevious | Selects the previous cell. |
| selectNext | Selects the next cell. |
| selectParent | Selects the parent of the selection cell. |
| selectChild | Selects the first child of the selection cell. |
| collapse | Collapses the currently selected cells. |
| expand | Expands the currently selected cells. |
| bold | Toggle bold text style. |
| italic | Toggle italic text style. |
| underline | Toggle underline text style. |
| alignCellsLeft | Aligns the selection cells at the left. |
| alignCellsCenter | Aligns the selection cells in the center. |
| alignCellsRight | Aligns the selection cells at the right. |
| alignCellsTop | Aligns the selection cells at the top. |
| alignCellsMiddle | Aligns the selection cells in the middle. |
| alignCellsBottom | Aligns the selection cells at the bottom. |
| alignFontLeft | Sets the horizontal text alignment to left. |
| alignFontCenter | Sets the horizontal text alignment to center. |
| alignFontRight | Sets the horizontal text alignment to right. |
| alignFontTop | Sets the vertical text alignment to top. |
| alignFontMiddle | Sets the vertical text alignment to middle. |
| alignFontBottom | Sets the vertical text alignment to bottom. |
| toggleTasks | Shows or hides the tasks window. |
| toggleHelp | Shows or hides the help window. |
| toggleOutline | Shows or hides the outline window. |
| toggleConsole | Shows or hides the console window. |
mxEditor.prototype.configure = function ( node )
Configures the editor using the specified node. To load the configuration from a given URL the following code can be used to obtain the XML node.
var node = mxUtils.load(url).getDocumentElement();
| node | XML node that contains the configuration. |
mxEditor.prototype.addAction = function ( actionname, funct )
Binds the specified actionname to the specified function.
| actionname | String that specifies the name of the action to be added. |
| funct | Function that implements the new action. The first argument of the function is the editor it is used with, the second argument is the cell it operates upon. |
editor.addAction('test', function(editor, cell)
{
mxUtils.alert("test "+cell);
});
mxEditor.prototype.execute = function ( actionname, cell, evt )
Executes the function with the given name in actions passing the editor instance and given cell as the first and second argument. All additional arguments are passed to the action as well. This method contains a try-catch block and displays an error message if an action causes an exception. The exception is re-thrown after the error message was displayed.
editor.execute("showProperties", cell);
mxEditor.prototype.addTemplate = function ( name, template )
Adds the specified template under the given name in templates.
mxEditor.prototype.createGraph = function ()
Creates the graph for the editor. The graph is created with no container and is initialized from setGraphContainer.
mxEditor.prototype.createSwimlaneManager = function ( graph )
Sets the graph’s container using mxGraph.init.
mxEditor.prototype.setGraphContainer = function ( container )
Sets the graph’s container using mxGraph.init.
mxEditor.prototype.installDblClickHandler = function ( graph )
Overrides mxGraph.dblClick to invoke dblClickAction on a cell and reset the selection tool in the toolbar.
mxEditor.prototype.installUndoHandler = function ( graph )
Adds the undoManager to the graph model and the view.
mxEditor.prototype.installInsertHandler = function ( graph )
Installs the handler for invoking insertFunction if one is defined.
mxEditor.prototype.createToolbar = function ()
Creates the toolbar with no container.
mxEditor.prototype.setStatusContainer = function ( container )
Creates the status using the specified container.
This implementation adds listeners in the editor to display the last saved time and the current filename in the status bar.
| container | DOM node that will contain the statusbar. |
mxEditor.prototype.setTitleContainer = function ( container )
Creates a listener to update the inner HTML of the specified DOM node with the value of getTitle.
| container | DOM node that will contain the title. |
mxEditor.prototype.treeLayout = function ( cell, horizontal )
Executes a vertical or horizontal compact tree layout using the specified cell as an argument. The cell may either be a group or the root of a tree.
| cell | mxCell to use in the compact tree layout. |
| horizontal | Optional boolean to specify the tree’s orientation. Default is true. |
mxEditor.prototype.getRootTitle = function ()
Returns the string value of the root cell in mxGraph.model.
mxEditor.prototype.undo = function ()
Undo the last change in graph.
mxEditor.prototype.redo = function ()
Redo the last change in graph.
mxEditor.prototype.groupCells = function ()
Invokes createGroup to create a new group cell and the invokes mxGraph.groupCells, using the grid size of the graph as the spacing in the group’s content area.
mxEditor.prototype.createGroup = function ()
Creates and returns a clone of defaultGroup to be used as a new group cell in <group>.
mxEditor.prototype.open = function ( filename )
Opens the specified file synchronously and parses it using readGraphModel. It updates filename and fires an open-event after the file has been opened. Exceptions should be handled as follows:
try
{
editor.open(filename);
}
catch (e)
{
mxUtils.error('Cannot open ' + filename +
': ' + e.message, 280, true);
}| filename | URL of the file to be opened. |
mxEditor.prototype.save = function ( url, linefeed )
Posts the string returned by writeGraphModel to the given URL or the URL returned by getUrlPost. The actual posting is carried out by postDiagram. If the URL is null then the resulting XML will be displayed using mxUtils.popup. Exceptions should be handled as follows:
try
{
editor.save();
}
catch (e)
{
mxUtils.error('Cannot save : ' + e.message, 280, true);
}
mxEditor.prototype.postDiagram = function ( url, data )
Hook for subclassers to override the posting of a diagram represented by the given node to the given URL. This fires an asynchronous <post> event if the diagram has been posted.
To replace the diagram with the diagram in the response, use the following code.
editor.addListener(mxEvent.POST, function(sender, evt)
{
// Process response (replace diagram)
var req = evt.getProperty('request');
var root = req.getDocumentElement();
editor.graph.readGraphModel(root)
});
mxEditor.prototype.writeGraphModel = function ( linefeed )
Hook to create the string representation of the diagram. The default implementation uses an mxCodec to encode the graph model as follows:
var enc = new mxCodec(); var node = enc.encode(this.graph.getModel()); return mxUtils.getXml(node, this.linefeed);
| linefeed | Optional character to be used as the linefeed. Default is <linefeed>. |
mxEditor.prototype.getUrlImage = function ()
Returns the URL to create the image with. This is typically the URL of a backend which accepts an XML representation of a graph view to create an image. The function is used in the image action to create an image. This implementation returns urlImage.
mxEditor.prototype.showProperties = function ( cell )
Creates and shows the properties dialog for the given cell. The content area of the dialog is created using createProperties.
mxEditor.prototype.showTasks = function ()
Shows the tasks window. The tasks window is created using createTasks. The default width of the window is 200 pixels, the y-coordinate of the location can be specifies in tasksTop and the x-coordinate is right aligned with a 20 pixel offset from the right border. To change the location of the tasks window, the following code can be used:
var oldShowTasks = mxEditor.prototype.showTasks;
mxEditor.prototype.showTasks = function()
{
oldShowTasks.apply(this, arguments); // "supercall"
if (this.tasks != null)
{
this.tasks.setLocation(10, 10);
}
};
mxEditor.prototype.refreshTasks = function ( div )
Updates the contents of the tasks window using createTasks.
mxEditor.prototype.showHelp = function ( tasks )
Shows the help window. If the help window does not exist then it is created using an iframe pointing to the resource for the <code>urlHelp</code> key or urlHelp if the resource is undefined.
mxEditor.prototype.showOutline = function ()
Shows the outline window. If the window does not exist, then it is created using an mxOutline.
mxEditor.prototype.setMode = function( modename )
Puts the graph into the specified mode. The following modenames are supported:
| select | Selects using the left mouse button, new connections are disabled. |
| connect | Selects using the left mouse button or creates new connections if mouse over cell hotspot. See mxConnectionHandler. |
| pan | Pans using the left mouse button, new connections are disabled. |
mxEditor.prototype.createPopupMenu = function ( menu, cell, evt )
Uses popupHandler to create the menu in the graph’s panning handler. The redirection is setup in setToolbarContainer.
mxEditor.prototype.createEdge = function ( source, target )
Uses defaultEdge as the prototype for creating new edges in the connection handler of the graph. The style of the edge will be overridden with the value returned by getEdgeStyle.
mxEditor.prototype.getEdgeStyle = function ()
Returns a string identifying the style of new edges. The function is used in createEdge when new edges are created in the graph.
mxEditor.prototype.consumeCycleAttribute = function ( cell )
Returns the next attribute in cycleAttributeValues or null, if not attribute should be used in the specified cell.
mxEditor.prototype.cycleAttribute = function ( cell )
Uses the returned value from consumeCycleAttribute as the value for the cycleAttributeName key in the given cell’s style.
mxEditor.prototype.addVertex = function ( parent, vertex, x, y )
Adds the given vertex as a child of parent at the specified x and y coordinate and fires an addVertex event.
Singleton class that acts as a global registry for codecs.
1. Define a default codec with a new instance of the object to be handled.
var codec = new mxObjectCodec(new mxGraphModel());
2. Define the functions required for encoding and decoding objects.
codec.encode = function(enc, obj) { ... }
codec.decode = function(dec, node, into) { ... }3. Register the codec in the mxCodecRegistry.
mxCodecRegistry.register(codec);
mxObjectCodec.decode may be used to either create a new instance of an object or to configure an existing instance, in which case the into argument points to the existing object. In this case, we say the codec “configures” the object.
| Variables | |
| codecs | Maps from constructor names to codecs. |
| aliases | Maps from classnames to codecnames. |
| Functions | |
| register | Registers a new codec and associates the name of the template constructor in the codec with the codec object. |
| addAlias | Adds an alias for mapping a classname to a codecname. |
| getCodec | Returns a codec that handles objects that are constructed using the given constructor. |
register: function( codec )
Registers a new codec and associates the name of the template constructor in the codec with the codec object.
| codec | mxObjectCodec to be registered. |
XML codec for JavaScript object graphs. See mxObjectCodec for a description of the general encoding/decoding scheme. This class uses the codecs registered in mxCodecRegistry for encoding/decoding each object.
In order to resolve references, especially forward references, the mxCodec constructor must be given the document that contains the referenced elements.
The following code is used to encode a graph model.
var encoder = new mxCodec(); var result = encoder.encode(graph.getModel()); var xml = mxUtils.getXml(result);
Using the code below, an XML document is decoded into an existing model. The document may be obtained using one of the functions in mxUtils for loading an XML file, eg. mxUtils.get, or using mxUtils.parseXml for parsing an XML string.
var doc = mxUtils.parseXml(xmlString); var codec = new mxCodec(doc); codec.decode(doc.documentElement, graph.getModel());
This example demonstrates parsing a list of isolated cells into an existing graph model. Note that the cells do not have a parent reference so they can be added anywhere in the cell hierarchy after parsing.
var xml = '<root><mxCell id="2" value="Hello," vertex="1"><mxGeometry x="20" y="20" width="80" height="30" as="geometry"/></mxCell><mxCell id="3" value="World!" vertex="1"><mxGeometry x="200" y="150" width="80" height="30" as="geometry"/></mxCell><mxCell id="4" value="" edge="1" source="2" target="3"><mxGeometry relative="1" as="geometry"/></mxCell></root>';
var doc = mxUtils.parseXml(xml);
var codec = new mxCodec(doc);
var elt = doc.documentElement.firstChild;
var cells = [];
while (elt != null)
{
cells.push(codec.decode(elt));
elt = elt.nextSibling;
}
graph.addCells(cells);Using the following code, the selection cells of a graph are encoded and the output is displayed in a dialog box.
var enc = new mxCodec(); var cells = graph.getSelectionCells(); mxUtils.alert(mxUtils.getPrettyXml(enc.encode(cells)));
Newlines in the XML can be converted to <br>, in which case a ‘<br>’ argument must be passed to mxUtils.getXml as the second argument.
For debugging I/O you can use the following code to get the sequence of encoded objects:
var oldEncode = mxCodec.prototype.encode;
mxCodec.prototype.encode = function(obj)
{
mxLog.show();
mxLog.debug('mxCodec.encode: obj='+mxUtils.getFunctionName(obj.constructor));
return oldEncode.apply(this, arguments);
};Note that the I/O system adds object codecs for new object automatically. For decoding those objects, the constructor should be written as follows:
var MyObj = function(name)
{
// ...
};| Functions | |
| mxCodec | Constructs an XML encoder/decoder for the specified owner document. |
| Variables | |
| document | The owner document of the codec. |
| objects | Maps from IDs to objects. |
| elements | Lookup table for resolving IDs to elements. |
| encodeDefaults | Specifies if default values should be encoded. |
| Functions | |
| putObject | Assoiates the given object with the given ID and returns the given object. |
| getObject | Returns the decoded object for the element with the specified ID in document. |
| lookup | Hook for subclassers to implement a custom lookup mechanism for cell IDs. |
| getElementById | Returns the element with the given ID from document. |
| updateElements | Returns the element with the given ID from document. |
| addElement | Adds the given element to elements if it has an ID. |
| getId | Returns the ID of the specified object. |
| reference | Hook for subclassers to implement a custom method for retrieving IDs from objects. |
| encode | Encodes the specified object and returns the resulting XML node. |
| decode | Decodes the given XML node. |
| encodeCell | Encoding of cell hierarchies is built-into the core, but is a higher-level function that needs to be explicitely used by the respective object encoders (eg. |
| isCellCodec | Returns true if the given codec is a cell codec. |
| decodeCell | Decodes cells that have been encoded using inversion, ie. |
| insertIntoGraph | Inserts the given cell into its parent and terminal cells. |
| setAttribute | Sets the attribute on the specified node to value. |
function mxCodec( document )
Constructs an XML encoder/decoder for the specified owner document.
| document | Optional XML document that contains the data. If no document is specified then a new document is created using mxUtils.createXmlDocument. |
mxCodec.prototype.getElementById = function( id )
Returns the element with the given ID from document.
| id | String that contains the ID. |
mxCodec.prototype.updateElements = function()
Returns the element with the given ID from document.
| id | String that contains the ID. |
mxCodec.prototype.addElement = function( node )
Adds the given element to elements if it has an ID.
mxCodec.prototype.getId = function( obj )
Returns the ID of the specified object. This implementation calls reference first and if that returns null handles the object as an mxCell by returning their IDs using mxCell.getId. If no ID exists for the given cell, then an on-the-fly ID is generated using mxCellPath.create.
| obj | Object to return the ID for. |
mxCodec.prototype.reference = function( obj )
Hook for subclassers to implement a custom method for retrieving IDs from objects. This implementation always returns null.
var codec = new mxCodec();
codec.reference = function(obj)
{
return obj.getCustomId();
};| obj | Object whose ID should be returned. |
mxCodec.prototype.decode = function( node, into )
Decodes the given XML node. The optional “into” argument specifies an existing object to be used. If no object is given, then a new instance is created using the constructor from the codec.
The function returns the passed in object or the new instance if no object was given.
| node | XML node to be decoded. |
| into | Optional object to be decodec into. |
mxCodec.prototype.encodeCell = function( cell, node, includeChildren )
Encoding of cell hierarchies is built-into the core, but is a higher-level function that needs to be explicitely used by the respective object encoders (eg. mxModelCodec, mxChildChangeCodec and mxRootChangeCodec). This implementation writes the given cell and its children as a (flat) sequence into the given node. The children are not encoded if the optional includeChildren is false. The function is in charge of adding the result into the given node and has no return value.
| cell | mxCell to be encoded. |
| node | Parent XML node to add the encoded cell into. |
| includeChildren | Optional boolean indicating if the function should include all descendents. Default is true. |
mxCodec.prototype.isCellCodec = function( codec )
Returns true if the given codec is a cell codec. This uses mxCellCodec.isCellCodec to check if the codec is of the given type.
mxCodec.prototype.decodeCell = function( node, restoreStructures )
Decodes cells that have been encoded using inversion, ie. where the user object is the enclosing node in the XML, and restores the group and graph structure in the cells. Returns a new mxCell instance that represents the given node.
| node | XML node that contains the cell data. |
| restoreStructures | Optional boolean indicating whether the graph structure should be restored by calling insert and insertEdge on the parent and terminals, respectively. Default is true. |
mxCodec.prototype.setAttribute = function( node, attribute, value )
Sets the attribute on the specified node to value. This is a helper method that makes sure the attribute and value arguments are not null.
| node | XML node to set the attribute for. |
| attributes | Attributename to be set. |
| value | New value of the attribute. |
Generic codec for JavaScript objects that implements a mapping between JavaScript objects and XML nodes that maps each field or element to an attribute or child node, and vice versa.
Consider the following example.
var obj = new Object(); obj.foo = "Foo"; obj.bar = "Bar";
This object is encoded into an XML node using the following.
var enc = new mxCodec(); var node = enc.encode(obj);
The output of the encoding may be viewed using mxLog as follows.
mxLog.show(); mxLog.debug(mxUtils.getPrettyXml(node));
Finally, the result of the encoding looks as follows.
<Object foo="Foo" bar="Bar"/>
In the above output, the foo and bar fields have been mapped to attributes with the same names, and the name of the constructor was used for the nodename.
Since booleans are numbers in JavaScript, all boolean values are encoded into 1 for true and 0 for false. The decoder also accepts the string true and false for boolean values.
The above scheme is applied to all atomic fields, that is, to all non-object fields of an object. For object fields, a child node is created with a special attribute that contains the fieldname. This special attribute is called “as” and hence, as is a reserved word that should not be used for a fieldname.
Consider the following example where foo is an object and bar is an atomic property of foo.
var obj = {foo: {bar: "Bar"}};This will be mapped to the following XML structure by mxObjectCodec.
<Object> <Object bar="Bar" as="foo"/> </Object>
In the above output, the inner Object node contains the as-attribute that specifies the fieldname in the enclosing object. That is, the field foo was mapped to a child node with an as-attribute that has the value foo.
Arrays are special objects that are either associative, in which case each key, value pair is treated like a field where the key is the fieldname, or they are a sequence of atomic values and objects, which is mapped to a sequence of child nodes. For object elements, the above scheme is applied without the use of the special as-attribute for creating each child. For atomic elements, a special add-node is created with the value stored in the value-attribute.
For example, the following array contains one atomic value and one object with a field called bar. Furthermore it contains two associative entries called bar with an atomic value, and foo with an object value.
var obj = ["Bar", {bar: "Bar"}];
obj["bar"] = "Bar";
obj["foo"] = {bar: "Bar"};This array is represented by the following XML nodes.
<Array bar="Bar"> <add value="Bar"/> <Object bar="Bar"/> <Object bar="Bar" as="foo"/> </Array>
The Array node name is the name of the constructor. The additional as-attribute in the last child contains the key of the associative entry, whereas the second last child is part of the array sequence and does not have an as-attribute.
Objects may be represented as child nodes or attributes with ID values, which are used to lookup the object in a table within mxCodec. The isReference function is in charge of deciding if a specific field should be encoded as a reference or not. Its default implementation returns true if the fieldname is in idrefs, an array of strings that is used to configure the mxObjectCodec.
Using this approach, the mapping does not guarantee that the referenced object itself exists in the document. The fields that are encoded as references must be carefully chosen to make sure all referenced objects exist in the document, or may be resolved by some other means if necessary.
For example, in the case of the graph model all cells are stored in a tree whose root is referenced by the model’s root field. A tree is a structure that is well suited for an XML representation, however, the additional edges in the graph model have a reference to a source and target cell, which are also contained in the tree. To handle this case, the source and target cell of an edge are treated as references, whereas the children are treated as objects. Since all cells are contained in the tree and no edge references a source or target outside the tree, this setup makes sure all referenced objects are contained in the document.
In the case of a tree structure we must further avoid infinite recursion by ignoring the parent reference of each child. This is done by returning true in isExcluded, whose default implementation uses the array of excluded fieldnames passed to the mxObjectCodec constructor.
References are only used for cells in mxGraph. For defining other referencable object types, the codec must be able to work out the ID of an object. This is done by implementing mxCodec.reference. For decoding a reference, the XML node with the respective id-attribute is fetched from the document, decoded, and stored in a lookup table for later reference. For looking up external objects, mxCodec.lookup may be implemented.
For decoding JavaScript expressions, the add-node may be used with a text content that contains the JavaScript expression. For example, the following creates a field called foo in the enclosing object and assigns it the value of mxConstants.ALIGN_LEFT.
<Object> <add as="foo">mxConstants.ALIGN_LEFT</add> </Object>
The resulting object has a field called foo with the value “left”. Its XML representation looks as follows.
<Object foo="left"/>
This means the expression is evaluated at decoding time and the result of the evaluation is stored in the respective field. Valid expressions are all JavaScript expressions, including function definitions, which are mapped to functions on the resulting object.
Expressions are only evaluated if allowEval is true.
| Functions | |
| mxObjectCodec | Constructs a new codec for the specified template object. |
| Variables | |
| allowEval | Static global switch that specifies if expressions in arrays are allowed. |
| template | Holds the template object associated with this codec. |
| exclude | Array containing the variable names that should be ignored by the codec. |
| idrefs | Array containing the variable names that should be turned into or converted from references. |
| mapping | Maps from from fieldnames to XML attribute names. |
| reverse | Maps from from XML attribute names to fieldnames. |
| Functions | |
| getName | Returns the name used for the nodenames and lookup of the codec when classes are encoded and nodes are decoded. |
| cloneTemplate | Returns a new instance of the template for this codec. |
| getFieldName | Returns the fieldname for the given attributename. |
| getAttributeName | Returns the attributename for the given fieldname. |
| isExcluded | Returns true if the given attribute is to be ignored by the codec. |
| isReference | Returns true if the given fieldname is to be treated as a textual reference (ID). |
| encode | Encodes the specified object and returns a node representing then given object. |
| encodeObject | Encodes the value of each member in then given obj into the given node using encodeValue. |
| encodeValue | Converts the given value according to the mappings and id-refs in this codec and uses writeAttribute to write the attribute into the given node. |
| writeAttribute | Writes the given value into node using writePrimitiveAttribute or writeComplexAttribute depending on the type of the value. |
| writePrimitiveAttribute | Writes the given value as an attribute of the given node. |
| writeComplexAttribute | Writes the given value as a child node of the given node. |
| convertAttributeToXml | Converts true to “1” and false to “0” is isBooleanAttribute returns true. |
| isBooleanAttribute | Returns true if the given object attribute is a boolean value. |
| convertAttributeFromXml | Converts booleans and numeric values to the respective types. |
| isNumericAttribute | Returns true if the given XML attribute is or should be a numeric value. |
| beforeEncode | Hook for subclassers to pre-process the object before encoding. |
| afterEncode | Hook for subclassers to post-process the node for the given object after encoding and return the post-processed node. |
| decode | Parses the given node into the object or returns a new object representing the given node. |
| decodeNode | Calls decodeAttributes and decodeChildren for the given node. |
| decodeAttributes | Decodes all attributes of the given node using decodeAttribute. |
| isIgnoredAttribute | Returns true if the given attribute should be ignored. |
| decodeAttribute | Reads the given attribute into the specified object. |
| decodeChildren | Decodes all children of the given node using decodeChild. |
| decodeChild | Reads the specified child into the given object. |
| getFieldTemplate | Returns the template instance for the given field. |
| addObjectValue | Sets the decoded child node as a value of the given object. |
| processInclude | Returns true if the given node is an include directive and executes the include by decoding the XML document. |
| beforeDecode | Hook for subclassers to pre-process the node for the specified object and return the node to be used for further processing by decode. |
| afterDecode | Hook for subclassers to post-process the object after decoding. |
function mxObjectCodec( template, exclude, idrefs, mapping )
Constructs a new codec for the specified template object. The variables in the optional exclude array are ignored by the codec. Variables in the optional idrefs array are turned into references in the XML. The optional mapping may be used to map from variable names to XML attributes. The argument is created as follows:
var mapping = new Object(); mapping['variableName'] = 'attribute-name';
| template | Prototypical instance of the object to be encoded/decoded. |
| exclude | Optional array of fieldnames to be ignored. |
| idrefs | Optional array of fieldnames to be converted to/from references. |
| mapping | Optional mapping from field- to attributenames. |
mxObjectCodec.prototype.idrefs
Array containing the variable names that should be turned into or converted from references. See mxCodec.getId and mxCodec.getObject.
mxObjectCodec.prototype.getName = function()
Returns the name used for the nodenames and lookup of the codec when classes are encoded and nodes are decoded. For classes to work with this the codec registry automatically adds an alias for the classname if that is different than what this returns. The default implementation returns the classname of the template class.
mxObjectCodec.prototype.getFieldName = function( attributename )
Returns the fieldname for the given attributename. Looks up the value in the reverse mapping or returns the input if there is no reverse mapping for the given name.
mxObjectCodec.prototype.getAttributeName = function( fieldname )
Returns the attributename for the given fieldname. Looks up the value in the mapping or returns the input if there is no mapping for the given name.
mxObjectCodec.prototype.isExcluded = function( obj, attr, value, write )
Returns true if the given attribute is to be ignored by the codec. This implementation returns true if the given fieldname is in exclude or if the fieldname equals mxObjectIdentity.FIELD_NAME.
| obj | Object instance that contains the field. |
| attr | Fieldname of the field. |
| value | Value of the field. |
| write | Boolean indicating if the field is being encoded or decoded. Write is true if the field is being encoded, else it is being decoded. |
mxObjectCodec.prototype.isReference = function( obj, attr, value, write )
Returns true if the given fieldname is to be treated as a textual reference (ID). This implementation returns true if the given fieldname is in idrefs.
| obj | Object instance that contains the field. |
| attr | Fieldname of the field. |
| value | Value of the field. |
| write | Boolean indicating if the field is being encoded or decoded. Write is true if the field is being encoded, else it is being decoded. |
mxObjectCodec.prototype.encode = function( enc, obj )
Encodes the specified object and returns a node representing then given object. Calls beforeEncode after creating the node and afterEncode with the resulting node after processing.
Enc is a reference to the calling encoder. It is used to encode complex objects and create references.
This implementation encodes all variables of an object according to the following rules:
If no ID exists for a variable in idrefs or if an object cannot be encoded, a warning is issued using mxLog.warn.
Returns the resulting XML node that represents the given object.
| enc | mxCodec that controls the encoding process. |
| obj | Object to be encoded. |
mxObjectCodec.prototype.encodeObject = function( enc, obj, node )
Encodes the value of each member in then given obj into the given node using encodeValue.
| enc | mxCodec that controls the encoding process. |
| obj | Object to be encoded. |
| node | XML node that contains the encoded object. |
mxObjectCodec.prototype.encodeValue = function( enc, obj, name, value, node )
Converts the given value according to the mappings and id-refs in this codec and uses writeAttribute to write the attribute into the given node.
| enc | mxCodec that controls the encoding process. |
| obj | Object whose property is going to be encoded. |
| name | XML node that contains the encoded object. |
| value | Value of the property to be encoded. |
| node | XML node that contains the encoded object. |
mxObjectCodec.prototype.writeAttribute = function( enc, obj, name, value, node )
Writes the given value into node using writePrimitiveAttribute or writeComplexAttribute depending on the type of the value.
mxObjectCodec.prototype.convertAttributeToXml = function( enc, obj, name, value )
Converts true to “1” and false to “0” is isBooleanAttribute returns true. All other values are not converted.
| enc | mxCodec that controls the encoding process. |
| obj | Objec to convert the attribute for. |
| name | Name of the attribute to be converted. |
| value | Value to be converted. |
mxObjectCodec.prototype.isBooleanAttribute = function( enc, obj, name, value )
Returns true if the given object attribute is a boolean value.
| enc | mxCodec that controls the encoding process. |
| obj | Objec to convert the attribute for. |
| name | Name of the attribute to be converted. |
| value | Value of the attribute to be converted. |
mxObjectCodec.prototype.convertAttributeFromXml = function( dec, attr, obj )
Converts booleans and numeric values to the respective types. Values are numeric if isNumericAttribute returns true.
| dec | mxCodec that controls the decoding process. |
| attr | XML attribute to be converted. |
| obj | Objec to convert the attribute for. |
mxObjectCodec.prototype.isNumericAttribute = function( dec, attr, obj )
Returns true if the given XML attribute is or should be a numeric value.
| dec | mxCodec that controls the decoding process. |
| attr | XML attribute to be converted. |
| obj | Objec to convert the attribute for. |
mxObjectCodec.prototype.beforeEncode = function( enc, obj, node )
Hook for subclassers to pre-process the object before encoding. This returns the input object. The return value of this function is used in encode to perform the default encoding into the given node.
| enc | mxCodec that controls the encoding process. |
| obj | Object to be encoded. |
| node | XML node to encode the object into. |
mxObjectCodec.prototype.afterEncode = function( enc, obj, node )
Hook for subclassers to post-process the node for the given object after encoding and return the post-processed node. This implementation returns the input node. The return value of this method is returned to the encoder from encode.
| enc | mxCodec that controls the encoding process. |
| obj | Object to be encoded. |
| node | XML node that represents the default encoding. |
mxObjectCodec.prototype.decode = function( dec, node, into )
Parses the given node into the object or returns a new object representing the given node.
Dec is a reference to the calling decoder. It is used to decode complex objects and resolve references.
If a node has an id attribute then the object cache is checked for the object. If the object is not yet in the cache then it is constructed using the constructor of template and cached in mxCodec.objects.
This implementation decodes all attributes and childs of a node according to the following rules:
For add nodes where the object is not an array and the variable name is defined, the default mechanism is used, allowing to override/add methods as follows:
<Object>
<add as="hello"><![CDATA[
function(arg1) {
mxUtils.alert('Hello '+arg1);
}
]]></add>
</Object>If no object exists for an ID in idrefs a warning is issued using mxLog.warn.
Returns the resulting object that represents the given XML node or the object given to the method as the into parameter.
| dec | mxCodec that controls the decoding process. |
| node | XML node to be decoded. |
| into | Optional objec to encode the node into. |
mxObjectCodec.prototype.decodeNode = function( dec, node, obj )
Calls decodeAttributes and decodeChildren for the given node.
| dec | mxCodec that controls the decoding process. |
| node | XML node to be decoded. |
| obj | Objec to encode the node into. |
mxObjectCodec.prototype.decodeAttributes = function( dec, node, obj )
Decodes all attributes of the given node using decodeAttribute.
| dec | mxCodec that controls the decoding process. |
| node | XML node to be decoded. |
| obj | Objec to encode the node into. |
mxObjectCodec.prototype.isIgnoredAttribute = function( dec, attr, obj )
Returns true if the given attribute should be ignored. This implementation returns true if the attribute name is “as” or “id”.
| dec | mxCodec that controls the decoding process. |
| attr | XML attribute to be decoded. |
| obj | Objec to encode the attribute into. |
mxObjectCodec.prototype.decodeAttribute = function( dec, attr, obj )
Reads the given attribute into the specified object.
| dec | mxCodec that controls the decoding process. |
| attr | XML attribute to be decoded. |
| obj | Objec to encode the attribute into. |
mxObjectCodec.prototype.decodeChildren = function( dec, node, obj )
Decodes all children of the given node using decodeChild.
| dec | mxCodec that controls the decoding process. |
| node | XML node to be decoded. |
| obj | Objec to encode the node into. |
mxObjectCodec.prototype.decodeChild = function( dec, child, obj )
Reads the specified child into the given object.
| dec | mxCodec that controls the decoding process. |
| child | XML child element to be decoded. |
| obj | Objec to encode the node into. |
mxObjectCodec.prototype.getFieldTemplate = function( obj, fieldname, child )
Returns the template instance for the given field. This returns the value of the field, null if the value is an array or an empty collection if the value is a collection. The value is then used to populate the field for a new instance. For strongly typed languages it may be required to override this to return the correct collection instance based on the encoded child.
mxObjectCodec.prototype.addObjectValue = function( obj, fieldname, value, template )
Sets the decoded child node as a value of the given object. If the object is a map, then the value is added with the given fieldname as a key. If the fieldname is not empty, then setFieldValue is called or else, if the object is a collection, the value is added to the collection. For strongly typed languages it may be required to override this with the correct code to add an entry to an object.
mxObjectCodec.prototype.processInclude = function( dec, node, into )
Returns true if the given node is an include directive and executes the include by decoding the XML document. Returns false if the given node is not an include directive.
| dec | mxCodec that controls the encoding/decoding process. |
| node | XML node to be checked. |
| into | Optional object to pass-thru to the codec. |
mxObjectCodec.prototype.beforeDecode = function( dec, node, obj )
Hook for subclassers to pre-process the node for the specified object and return the node to be used for further processing by decode. The object is created based on the template in the calling method and is never null. This implementation returns the input node. The return value of this function is used in decode to perform the default decoding into the given object.
| dec | mxCodec that controls the decoding process. |
| node | XML node to be decoded. |
| obj | Object to encode the node into. |
mxObjectCodec.prototype.afterDecode = function( dec, node, obj )
Hook for subclassers to post-process the object after decoding. This implementation returns the given object without any changes. The return value of this method is returned to the decoder from decode.
| enc | mxCodec that controls the encoding process. |
| node | XML node to be decoded. |
| obj | Object that represents the default decoding. |
Codec for mxCells. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
mxCodecRegistry.getCodec(mxCell).exclude.push(‘name_of_field’);
To subclass mxCell, replace the template and add an alias as follows.
function CustomCell(value, geometry, style)
{
mxCell.apply(this, arguments);
}
mxUtils.extend(CustomCell, mxCell);
mxCodecRegistry.getCodec(mxCell).template = new CustomCell();
mxCodecRegistry.addAlias('CustomCell', 'mxCell');| Functions | |
| isCellCodec | Returns true since this is a cell codec. |
| isExcluded | Excludes user objects that are XML nodes. |
| afterEncode | Encodes an mxCell and wraps the XML up inside the XML of the user object (inversion). |
| beforeDecode | Decodes an mxCell and uses the enclosing XML node as the user object for the cell (inversion). |
codec.afterEncode = function( enc, obj, node )
Encodes an mxCell and wraps the XML up inside the XML of the user object (inversion).
codec.beforeDecode = function( dec, node, obj )
Decodes an mxCell and uses the enclosing XML node as the user object for the cell (inversion).
Codec for mxGraphModels. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
| Functions | |
| encodeObject | Encodes the given mxGraphModel by writing a (flat) XML sequence of cell nodes as produced by the mxCellCodec. |
| decodeChild | Overrides decode child to handle special child nodes. |
| decodeRoot | Reads the cells into the graph model. |
codec.encodeObject = function( enc, obj, node )
Encodes the given mxGraphModel by writing a (flat) XML sequence of cell nodes as produced by the mxCellCodec. The sequence is wrapped-up in a node with the name root.
Codec for mxRootChanges. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
| Functions | |
| onEncode | Encodes the child recursively. |
| beforeDecode | Decodes the optional children as cells using the respective decoder. |
| afterDecode | Restores the state by assigning the previous value. |
Codec for mxChildChanges. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
| Functions | |
| isReference | Returns true for the child attribute if the child cell had a previous parent or if we’re reading the child as an attribute rather than a child node, in which case it’s always a reference. |
| isExcluded | Excludes references to parent or previous if not in the model. |
| afterEncode | Encodes the child recusively and adds the result to the given node. |
| beforeDecode | Decodes the any child nodes as using the respective codec from the registry. |
| afterDecode | Restores object state in the child change. |
Codec for mxTerminalChanges. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
| Functions | |
| afterDecode | Restores the state by assigning the previous value. |
Codec for mxValueChanges, mxStyleChanges, mxGeometryChanges, mxCollapseChanges and mxVisibleChanges. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
| Functions | |
| mxGenericChangeCodec | Factory function that creates a mxObjectCodec for the specified change and fieldname. |
| afterDecode | Restores the state by assigning the previous value. |
var mxGenericChangeCodec = function( obj, variable )
Factory function that creates a mxObjectCodec for the specified change and fieldname.
| obj | An instance of the change object. |
| variable | The fieldname for the change data. |
Codec for mxGraphs. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
Custom encoder for mxGraphViews. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry. This codec only writes views into a XML format that can be used to create an image for the graph, that is, it contains absolute coordinates with computed perimeters, edge styles and cell styles.
| Functions | |
| encode | Encodes the given mxGraphView using encodeCell starting at the model’s root. |
| encodeCell | Recursively encodes the specifed cell. |
codec.encode = function( enc, view )
Encodes the given mxGraphView using encodeCell starting at the model’s root. This returns the top-level graph node of the recursive encoding.
codec.encodeCell = function( enc, view, cell )
Recursively encodes the specifed cell. Uses layer as the default nodename. If the cell’s parent is null, then graph is used for the nodename. If mxGraphModel.isEdge returns true for the cell, then edge is used for the nodename, else if mxGraphModel.isVertex returns true for the cell, then vertex is used for the nodename.
mxGraph.getLabel is used to create the label attribute for the cell. For graph nodes and vertices the bounds are encoded into x, y, width and height. For edges the points are encoded into a points attribute as a space-separated list of comma-separated coordinate pairs (eg. x0,y0 x1,y1 ... xn,yn). All values from the cell style are added as attribute values to the node.
Codec for mxStylesheets. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
codec.encode = function( enc, obj )
Encodes a stylesheet. See decode for a description of the format.
codec.decode = function( dec, node, into )
Reads a sequence of the following child nodes and attributes:
| add | Adds a new style. |
| as | Name of the style. |
| extend | Name of the style to inherit from. |
Each node contains another sequence of add and remove nodes with the following attributes:
| as | Name of the style (see mxConstants). |
| value | Value for the style. |
Instead of the value-attribute, one can put Javascript expressions into the node as follows if mxStylesheetCodec.allowEval is true: <add as=”perimeter”>mxPerimeter.RectanglePerimeter</add>
A remove node will remove the entry with the name given in the as-attribute from the style.
<mxStylesheet as="stylesheet">
<add as="text">
<add as="fontSize" value="12"/>
</add>
<add as="defaultVertex" extend="text">
<add as="shape" value="rectangle"/>
</add>
</mxStylesheet>Custom codec for configuring mxDefaultKeyHandlers. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry. This codec only reads configuration data for existing key handlers, it does not encode or create key handlers.
codec.decode = function( dec, node, into )
Reads a sequence of the following child nodes and attributes:
| add | Binds a keystroke to an actionname. |
| as | Keycode. |
| action | Actionname to execute in editor. |
| control | Optional boolean indicating if the control key must be pressed. |
<mxDefaultKeyHandler as="keyHandler"> <add as="88" control="true" action="cut"/> <add as="67" control="true" action="copy"/> <add as="86" control="true" action="paste"/> </mxDefaultKeyHandler>
The keycodes are for the x, c and v keys.
See also: mxDefaultKeyHandler.bindAction, http://www.js-examples.com
Custom codec for configuring mxDefaultToolbars. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry. This codec only reads configuration data for existing toolbars handlers, it does not encode or create toolbars.
codec.decode = function( dec, node, into )
Reads a sequence of the following child nodes and attributes:
| add | Adds a new item to the toolbar. See below for attributes. |
| separator | Adds a vertical separator. No attributes. |
| hr | Adds a horizontal separator. No attributes. |
| br | Adds a linefeed. No attributes. |
| as | Resource key for the label. |
| action | Name of the action to execute in enclosing editor. |
| mode | Modename (see below). |
| template | Template name for cell insertion. |
| style | Optional style to override the template style. |
| icon | Icon (relative/absolute URL). |
| pressedIcon | Optional icon for pressed state (relative/absolute URL). |
| id | Optional ID to be used for the created DOM element. |
| toggle | Optional 0 or 1 to disable toggling of the element. Default is 1 (true). |
The action, mode and template attributes are mutually exclusive. The style can only be used with the template attribute. The add node may contain another sequence of add nodes with as and action attributes to create a combo box in the toolbar. If the icon is specified then a list of the child node is expected to have its template attribute set and the action is ignored instead.
Nodes with a specified template may define a function to be used for inserting the cloned template into the graph. Here is an example of such a node:
<add as="Swimlane" template="swimlane" icon="images/swimlane.gif"><![CDATA[
function (editor, cell, evt, targetCell)
{
var pt = mxUtils.convertPoint(
editor.graph.container, mxEvent.getClientX(evt),
mxEvent.getClientY(evt));
return editor.addVertex(targetCell, cell, pt.x, pt.y);
}
]]></add>In the above function, editor is the enclosing mxEditor instance, cell is the clone of the template, evt is the mouse event that represents the drop and targetCell is the cell under the mousepointer where the drop occurred. The targetCell is retrieved using mxGraph.getCellAt.
Futhermore, nodes with the mode attribute may define a function to be executed upon selection of the respective toolbar icon. In the example below, the default edge style is set when this specific connect-mode is activated:
<add as="connect" mode="connect"><![CDATA[
function (editor)
{
if (editor.defaultEdge != null)
{
editor.defaultEdge.style = 'straightEdge';
}
}
]]></add>Both functions require mxDefaultToolbarCodec.allowEval to be set to true.
| select | Left mouse button used for rubberband- & cell-selection. |
| connect | Allows connecting vertices by inserting new edges. |
| pan | Disables selection and switches to panning on the left button. |
<mxDefaultToolbar as="toolbar"> <add as="save" action="save" icon="images/save.gif"/> <br/><hr/> <add as="select" mode="select" icon="images/select.gif"/> <add as="connect" mode="connect" icon="images/connect.gif"/> </mxDefaultToolbar>
Custom codec for configuring mxDefaultPopupMenus. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry. This codec only reads configuration data for existing popup menus, it does not encode or create menus. Note that this codec only passes the configuration node to the popup menu, which uses the config to dynamically create menus. See mxDefaultPopupMenu.createMenu.
| Functions | |
| encode | Returns null. |
| decode | Uses the given node as the config for mxDefaultPopupMenu. |
codec.decode = function( dec, node, into )
Uses the given node as the config for mxDefaultPopupMenu.
Codec for mxEditors. This class is created and registered dynamically at load time and used implicitely via mxCodec and the mxCodecRegistry.
| Functions | |
| beforeDecode | Decodes the ui-part of the configuration node by reading a sequence of the following child nodes and attributes and passes the control to the default decoding mechanism: |
| decodeChild | Overrides decode child to handle special child nodes. |
| decodeTemplates | Decodes the cells from the given node as templates. |
| decodeTemplates | Decodes the cells from the given node as templates. |
Decodes the ui-part of the configuration node by reading a sequence of the following child nodes and attributes and passes the control to the default decoding mechanism:
| stylesheet | Adds a CSS stylesheet to the document. |
| resource | Adds the basename of a resource bundle. |
| add | Creates or configures a known UI element. |
These elements may appear in any order given that the graph UI element is added before the toolbar element (see Known Keys).
| as | Key for the UI element (see below). |
| element | ID for the element in the document. |
| style | CSS style to be used for the element or window. |
| x | X coordinate for the new window. |
| y | Y coordinate for the new window. |
| width | Width for the new window. |
| height | Optional height for the new window. |
| name | Name of the stylesheet (absolute/relative URL). |
| basename | Basename of the resource bundle (see mxResources). |
The x, y, width and height attributes are used to create a new mxWindow if the element attribute is not specified in an add node. The name and basename are only used in the stylesheet and resource nodes, respectively.
| graph | Main graph element (see mxEditor.setGraphContainer). |
| title | Title element (see mxEditor.setTitleContainer). |
| toolbar | Toolbar element (see mxEditor.setToolbarContainer). |
| status | Status bar element (see mxEditor.setStatusContainer). |
<ui>
<stylesheet name="css/process.css"/>
<resource basename="resources/app"/>
<add as="graph" element="graph"
style="left:70px;right:20px;top:20px;bottom:40px"/>
<add as="status" element="status"/>
<add as="toolbar" x="10" y="20" width="54"/>
</ui>True if the current browser is Internet Explorer 10 or below.
IS_IE: navigator.userAgent.indexOf( 'MSIE' ) >
True if the current browser is Internet Explorer 6.x.
IS_IE6: navigator.userAgent.indexOf( 'MSIE 6' ) >
True if the current browser is Internet Explorer and it is in quirks mode.
IS_QUIRKS: navigator.userAgent.indexOf( 'MSIE' ) >
True if the browser is IE11 in enterprise mode (IE8 standards mode).
IS_EM: 'spellcheck' in document.createElement( 'textarea' ) && document.documentMode
True if the current browser is Netscape (including Firefox).
IS_NS: navigator.userAgent.indexOf( 'Mozilla/' ) >
True if the current browser is Opera.
IS_OP: navigator.userAgent.indexOf( 'Opera/' ) >
True if -o-transform is available as a CSS style, ie for Opera browsers based on a Presto engine with version 2.5 or later.
IS_OT: navigator.userAgent.indexOf( 'Presto/' ) >
True if the current browser is Safari.
IS_SF: navigator.userAgent.indexOf( 'AppleWebKit/' ) >
True if the current browser is Google Chrome.
IS_GC: navigator.userAgent.indexOf( 'Chrome/' ) >
True if the this is running inside a Chrome App.
IS_CHROMEAPP: window.chrome !
True if the current browser is Firefox.
IS_FF: navigator.userAgent.indexOf( 'Firefox/' ) >
True if the browser supports VML.
IS_VML: navigator.appName.toUpperCase()
True if the browser supports SVG.
IS_SVG: navigator.appName.toUpperCase() !
True if foreignObject support is not available.
NO_FO: !document.createElementNS || document.createElementNS( 'http://www.w3.org/2000/svg', 'foreignObject' ) !
True if this device supports Microsoft pointer events (always false on Macs).
IS_POINTER: window.PointerEvent !
Returns true if the current browser is supported, that is, if mxClient.IS_VML or mxClient.IS_SVG is true.
isBrowserSupported: function()
Adds a link node to the head of the document.
link: function( rel, href, doc, id )
Helper method to load the default bundles if mxLoadResources is false.
loadResources: function( fn, lan )
Dynamically adds a script node to the document header.
include: function( src )
Writes the specified string to the console if TRACE is true and returns the current time in milliseconds.
enter: function( string )
Writes the specified string to the console if TRACE is true and computes the difference between the current time and t0 in milliseconds.
leave: function( string, t0 )
Adds all arguments to the console if DEBUG is enabled.
debug: function()
Adds all arguments to the console if WARN is enabled.
warn: function()
Initializes the DOM node for the console.
init: function()
Writes the current navigator information to the console.
info: function()
Adds a button to the console using the given label and function.
addButton: function( lab, funct )
Returns true if the console is visible.
isVisible: function()
Shows the console.
show: function()
Shows or hides the console.
setVisible: function( visible )
Adds the specified strings to the console.
write: function()
Adds the specified strings to the console, appending a linefeed at the end of each string.
writeln: function()
Returns the ID for the given object or function or null if no object is specified.
get: function( obj )
Deletes the ID from the given object or function.
clear: function( obj )
Clears the dictionary.
mxDictionary.prototype.clear = function()
Returns the value for the given key.
mxDictionary.prototype.get = function( key )
Stores the value under the given key and returns the previous value for that key.
mxDictionary.prototype.put = function( key, value )
Removes the value for the given key and returns the value that has been removed.
mxDictionary.prototype.remove = function( key )
Returns all keys as an array.
mxDictionary.prototype.getKeys = function()
Returns all values as an array.
mxDictionary.prototype.getValues = function()
Visits all entries in the dictionary using the given function with the following signature: function(key, value) where key is a string and value is an object.
mxDictionary.prototype.visit = function( visitor )
Hook for subclassers to disable support for a given language.
isLanguageSupported: function( lan )
Hook for subclassers to return the URL for the special bundle.
getDefaultBundle: function( basename, lan )
Hook for subclassers to return the URL for the special bundle.
getSpecialBundle: function( basename, lan )
Adds the default and current language properties file for the specified basename.
add: function( basename, lan, callback )
Parses the key, value pairs in the specified text and stores them as local resources.
parse: function( text )
Returns the value for the specified resource key.
get: function( key, params, defaultValue )
Replaces the given placeholders with the given parameters.
replacePlaceholders: function( value, params )
Loads all required resources asynchronously.
loadResources: function( callback )
Constructs a new point for the optional x and y coordinates.
function mxPoint( x, y )
Holds the x-coordinate of the point.
mxPoint.prototype.x
Holds the y-coordinate of the point.
mxPoint.prototype.y
Returns true if the given object equals this point.
mxPoint.prototype.equals = function( obj )
Returns a clone of this mxPoint.
mxPoint.prototype.clone = function()
Constructs a new rectangle for the optional parameters.
function mxRectangle( x, y, width, height )
Holds the width of the rectangle.
mxRectangle.prototype.width
Holds the height of the rectangle.
mxRectangle.prototype.height
Sets this rectangle to the specified values
mxRectangle.prototype.setRect = function( x, y, w, h )
Returns the x-coordinate of the center point.
mxRectangle.prototype.getCenterX = function ()
Returns the y-coordinate of the center point.
mxRectangle.prototype.getCenterY = function ()
Adds the given rectangle to this rectangle.
mxRectangle.prototype.add = function( rect )
Changes this rectangle to where it overlaps with the given rectangle.
mxRectangle.prototype.intersect = function( rect )
Grows the rectangle by the given amount, that is, this method subtracts the given amount from the x- and y-coordinates and adds twice the amount to the width and height.
mxRectangle.prototype.grow = function( amount )
Returns the top, left corner as a new mxPoint.
mxRectangle.prototype.getPoint = function()
Rotates this rectangle by 90 degree around its center point.
mxRectangle.prototype.rotate90 = function()
Returns true if the given object equals this rectangle.
mxRectangle.prototype.equals = function( obj )
Returns a new mxRectangle which is a copy of the given rectangle.
mxRectangle.fromRectangle = function( rect )
Asynchronous animated move operation.
animateChanges: function( graph, changes, done )
Sets the opacity on the given cell and its descendants.
cascadeOpacity: function( graph, cell, opacity )
Asynchronous fade-out operation.
fadeOut: function( node, from, remove, step, delay, isEnabled )
Removes the cursors from the style of the given DOM node and its descendants.
removeCursors: function( element )
Returns the current style of the specified element.
getCurrentStyle: function()
Parses the given CSS numeric value adding handling for the values thin, medium and thick (2, 4 and 6).
parseCssNumber: function( value )
Adds the given style with the standard name and an optional vendor prefix for the current browser.
setPrefixedStyle: function()
Returns true if the overflow CSS property of the given node is either scroll or auto.
hasScrollbars: function( node )
Returns a wrapper function that locks the execution scope of the given function to the specified scope.
bind: function( scope, funct )
Evaluates the given expression using eval and returns the JavaScript object that represents the expression result.
eval: function( expr )
Returns the first node where attr equals value.
findNode: function( node, attr, value )
Returns the name for the given function.
getFunctionName: function( f )
Returns the index of obj in array or -1 if the array does not contain the given object.
indexOf: function( array, obj )
Calls the given function for each element of the given array and returns the array.
forEach: function( array, fn )
Removes all occurrences of the given object in the given array or object.
remove: function( obj, array )
Returns true if the given value is an XML node with the node name and if the optional attribute has the specified value.
isNode: function( value, nodeName, attributeName, attributeValue )
Returns true if the given ancestor is an ancestor of the given DOM node in the DOM.
isAncestorNode: function( ancestor, child )
Returns an array of child nodes that are of the given node type.
getChildNodes: function( node, nodeType )
Cross browser implementation for document.importNode.
importNode: function( doc, node, allChildren )
Returns a new, empty XML document.
createXmlDocument: function()
Parses the specified XML string into a new XML document and returns the new document.
parseXml: function()
Clears the current selection in the page.
clearSelection: function()
Removes the sibling text nodes for the given node that only consists of tabs, newlines and spaces.
removeWhitespace: function( node, before )
Replaces characters (less than, greater than, newlines and quotes) with their HTML entities in the given string and returns the result.
htmlEntities: function( s, newline )
Returns true if the given node is in the VML namespace.
isVml: function( node )
Returns the XML content of the specified node.
getXml: function( node, linefeed )
Returns the text content of the specified node.
extractTextWithWhitespace: function( elems )
Replaces each trailing newline with the given pattern.
replaceTrailingNewlines: function( str, pattern )
Returns the text content of the specified node.
getTextContent: function( node )
Sets the text content of the specified node.
setTextContent: function( node, text )
Returns the inner HTML for the given node as a string or an empty string if no node was specified.
getInnerHtml: function()
Returns the outer HTML for the given node as a string or an empty string if no node was specified.
getOuterHtml: function()
Creates a text node for the given string and appends it to the given parent.
write: function( parent, text )
Creates a text node for the given string and appends it to the given parent with an additional linefeed.
writeln: function( parent, text )
Appends a linebreak to the given parent and returns the linebreak.
br: function( parent, count )
Returns a new button with the given level and function as an onclick event handler.
button: function( label, funct, doc )
Appends a new paragraph with the given text to the specified parent and returns the paragraph.
para: function( parent, text )
Adds a transparent background to the filter of the given node.
addTransparentBackgroundFilter: function( node )
Adds a hyperlink to the specified parent that invokes action on the specified editor.
linkAction: function( parent, text, editor, action, pad )
Adds a hyperlink to the specified parent that invokes the specified function on the editor passing along the specified argument.
linkInvoke: function( parent, text, editor, functName, arg, pad )
Adds a hyperlink to the specified parent and invokes the given function when the link is clicked.
link: function( parent, text, funct, pad )
Returns the client size for the current document as an mxRectangle.
getDocumentSize: function()
Makes sure the given node is inside the visible area of the window.
fit: function( node )
Loads the specified URL synchronously and returns the mxXmlRequest.
load: function( url )
Loads the specified URL asynchronously and invokes the given functions depending on the request status.
get: function( url, onload, onerror, binary, timeout, ontimeout )
Loads the URLs in the given array asynchronously and invokes the given function if all requests returned with a valid 2xx status.
getAll: function( urls, onload, onerror )
Posts the specified params to the given URL asynchronously and invokes the given functions depending on the request status.
post: function( url, params, onload, onerror )
Submits the given parameters to the specified URL using mxXmlRequest.simulate and returns the mxXmlRequest.
submit: function( url, params, doc, target )
Creates and posts a request to the given target URL using a dynamically created form inside the given document.
mxXmlRequest.prototype.simulate = function( doc, target )
Loads the specified URL asynchronously into the specified document, invoking onload after the document has been loaded.
loadInto: function( url, doc, onload )
Returns the value for the given key in the given associative array or the given default value if the value is null.
getValue: function( array, key, defaultValue )
Returns the numeric value for the given key in the given associative array or the given default value (or 0) if the value is null.
getNumber: function( array, key, defaultValue )
Returns the color value for the given key in the given associative array or the given default value if the value is null.
getColor: function( array, key, defaultValue )
Recursively clones the specified object ignoring all fieldnames in the given array of transient fields.
clone: function( obj, transients, shallow )
Compares all mxPoints in the given lists.
equalPoints: function( a, b )
Returns true if all properties of the given objects are equal.
equalEntries: function( a, b )
Removes all duplicates from the given array.
removeDuplicates: function( arr )
Returns true if the given value is of type number and isNaN returns true.
isNaN: function( value )
Assigns a copy of the superclass prototype to the subclass prototype.
extend: function( ctor, superCtor )
Returns a textual representation of the specified object.
toString: function( obj )
Converts the given degree to radians.
toRadians: function( deg )
Converts the given radians to degree.
toDegree: function( rad )
Converts the given arc to a series of curves.
arcToCurves: function( x0, y0, r1, r2, angle, largeArcFlag, sweepFlag, x, y )
Returns the bounding box for the rotated rectangle.
getBoundingBox: function( rect, rotation, cx )
Rotates the given point by the given cos and sin.
getRotatedPoint: function( pt, cos, sin, c )
Reverse the port constraint bitmask.
reversePortConstraints: function( constraint )
Finds the index of the nearest segment on the given cell state for the specified coordinate pair.
findNearestSegment: function( state, x, y )
Adds the given margins to the given rectangle and rotates and flips the rectangle according to the respective styles in style.
getDirectedBounds: function ( rect, m, style, flipH, flipV )
Returns the intersection between the polygon defined by the array of points and the line between center and point.
getPerimeterPoint: function ( pts, center, point )
Returns true if the given rectangle intersects the given segment.
rectangleIntersectsSegment: function( bounds, p1, p2 )
Returns true if the specified point (x, y) is contained in the given rectangle.
contains: function( bounds, x, y )
Returns true if the two rectangles intersect.
intersects: function( a, b )
Returns the offset for the specified container as an mxPoint.
getOffset: function( container, scrollOffset )
Returns the scroll origin of the given document or the current document if no document is given.
getDocumentScrollOrigin: function( doc )
Returns the top, left corner of the viewrect as an mxPoint.
getScrollOrigin: function( node, includeAncestors, includeDocument )
Converts the specified point (x, y) using the offset of the specified container and returns a new mxPoint with the result.
convertPoint: function( container, x, y )
Strips all whitespaces from the beginning of the string.
ltrim: function( str, chars )
Strips all whitespaces from the end of the string.
rtrim: function( str, chars )
Strips all whitespaces from both end of the string.
trim: function( str, chars )
Returns true if the specified value is numeric, that is, if it is not null, not an empty string, not a HEX number and isNaN returns false.
isNumeric: function( n )
Returns true if the given value is an valid integer number.
isInteger: function( n )
Returns the remainder of division of n by m.
mod: function( n, m )
Returns the intersection of two lines as an mxPoint.
intersection: function ( x0, y0, x1, y1, x2, y2, x3, y3 )
Returns the square distance between a segment and a point.
ptSegDistSq: function( x1, y1, x2, y2, px, py )
Returns the distance between a line defined by two points and a point.
ptLineDist: function( x1, y1, x2, y2, px, py )
Returns 1 if the given point on the right side of the segment, 0 if its on the segment, and -1 if the point is on the left side of the segment.
relativeCcw: function( x1, y1, x2, y2, px, py )
See mxEffects.animateChanges.
animateChanges: function( graph, changes )
See mxEffects.cascadeOpacity.
cascadeOpacity: function( graph, cell, opacity )
See mxEffects.fadeOut.
fadeOut: function( node, from, remove, step, delay, isEnabled )
Sets the opacity of the specified DOM node to the given value in %.
setOpacity: function( node, value )
Creates and returns an image (IMG node) or VML image (v:image) in IE6 in quirks mode.
createImage: function( src )
Sorts the given cells according to the order in the cell hierarchy.
sortCells: function( cells, ascending )
Returns the stylename in a style of the form [(stylename|key=value);] or an empty string if the given style does not contain a stylename.
getStylename: function( style )
Returns the stylenames in a style of the form [(stylename|key=value);] or an empty array if the given style does not contain any stylenames.
getStylenames: function( style )
Returns the index of the given stylename in the given style.
indexOfStylename: function( style, stylename )
Adds the specified stylename to the given style if it does not already contain the stylename.
addStylename: function( style, stylename )
Removes all occurrences of the specified stylename in the given style and returns the updated style.
removeStylename: function( style, stylename )
Removes all stylenames from the given style and returns the updated style.
removeAllStylenames: function( style )
Assigns the value for the given key in the styles of the given cells, or removes the key from the styles if the value is null.
setCellStyles: function( model, cells, key, value )
Adds or removes the given key, value pair to the style and returns the new style.
setStyle: function( style, key, value )
Sets or toggles the flag bit for the given key in the cell’s styles.
setCellStyleFlags: function( model, cells, key, flag, value )
Sets or removes the given key from the specified style and returns the new style.
setStyleFlag: function( style, key, flag, value )
Returns an mxPoint that represents the horizontal and vertical alignment for numeric computations.
getAlignmentAsPoint: function( align, valign )
Returns an mxRectangle with the size (width and height in pixels) of the given string.
getSizeForString: function( text, fontSize, fontFamily, textWidth )
getViewXml: function( graph, scale, cells, x0, y0 )
Returns the scale to be used for printing the graph with the given bounds across the specifies number of pages with the given format.
getScaleForPageCount: function( pageCount, graph, pageFormat, border )
Copies the styles and the markup from the graph’s container into the given document and removes all cursor styles.
show: function( graph, doc, x0, y0, w, h )
Prints the specified graph using a new window and the built-in print dialog.
printScreen: function( graph )
Shows the specified text content in a new mxWindow or a new browser window if isInternalWindow is false.
popup: function( content, isInternalWindow )
Displayss the given alert in a new dialog.
alert: function( message )
Displays the given message in a prompt dialog.
prompt: function( message, defaultValue )
Displays the given message in a confirm dialog.
confirm: function( message )
Displays the given error message in a new mxWindow of the given width.
error: function( message, width, close, icon )
Configures the given DOM element to act as a drag source for the specified graph.
makeDraggable: function( element, graphF, funct, dragElement, dx, dy, autoscroll, scalePreview, highlightDropTargets, getDropTarget )
Implements a local orthogonal router between the given cells.
OrthConnector: function( state, source, target, points, result )
Name of the triangle perimeter.
PERIMETER_TRIANGLE: 'trianglePerimeter' }
Constructs a new event object with the specified name.
function mxEventObject( name )
Holds the name.
mxEventObject.prototype.name
Holds the properties as an associative array.
mxEventObject.prototype.properties
Holds the consumed state.
mxEventObject.prototype.consumed
Returns name.
mxEventObject.prototype.getName = function()
Returns properties.
mxEventObject.prototype.getProperties = function()
Returns the property for the given key.
mxEventObject.prototype.getProperty = function( key )
Returns true if the event has been consumed.
mxEventObject.prototype.isConsumed = function()
Consumes the event.
mxEventObject.prototype.consume = function()
Constructs a new event object for the given arguments.
function mxMouseEvent( evt, state )
Holds the consumed state of this event.
mxMouseEvent.prototype.consumed
Holds the inner event object.
mxMouseEvent.prototype.evt
Holds the x-coordinate of the event in the graph.
mxMouseEvent.prototype.graphX
Holds the y-coordinate of the event in the graph.
mxMouseEvent.prototype.graphY
Holds the optional mxCellState associated with this event.
mxMouseEvent.prototype.state
Holds the mxCellState that was passed to the constructor.
mxMouseEvent.prototype.sourceState
Returns evt.
mxMouseEvent.prototype.getEvent = function()
Returns the target DOM element using mxEvent.getSource for evt.
mxMouseEvent.prototype.getSource = function()
Returns the event’s target or srcElement depending on the browser.
getSource: function( evt )
Returns true if the given mxShape is the source of evt.
mxMouseEvent.prototype.isSource = function( shape )
Returns evt.clientX.
mxMouseEvent.prototype.getX = function()
Returns evt.clientY.
mxMouseEvent.prototype.getY = function()
Returns graphX.
mxMouseEvent.prototype.getGraphX = function()
Returns graphY.
mxMouseEvent.prototype.getGraphY = function()
Returns state.
mxMouseEvent.prototype.getState = function()
Returns the mxCell in state is not null.
mxMouseEvent.prototype.getCell = function()
Returns true if the event is a popup trigger.
mxMouseEvent.prototype.isPopupTrigger = function()
Returns consumed.
mxMouseEvent.prototype.isConsumed = function()
Sets consumed to true and invokes preventDefault on the native event if such a method is defined.
mxMouseEvent.prototype.consume = function( preventDefault )
Constructs a new event source.
function mxEventSource( eventSource )
Holds the event names and associated listeners in an array.
mxEventSource.prototype.eventListeners
Specifies if events can be fired.
mxEventSource.prototype.eventsEnabled
Optional source for events.
mxEventSource.prototype.eventSource
Returns eventsEnabled.
mxEventSource.prototype.isEventsEnabled = function()
Sets eventsEnabled.
mxEventSource.prototype.setEventsEnabled = function( value )
Returns eventSource.
mxEventSource.prototype.getEventSource = function()
Sets eventSource.
mxEventSource.prototype.setEventSource = function( value )
Binds the specified function to the given event name.
mxEventSource.prototype.addListener = function( name, funct )
Removes all occurrences of the given listener from eventListeners.
mxEventSource.prototype.removeListener = function( funct )
Dispatches the given event to the listeners which are registered for the event.
mxEventSource.prototype.fireEvent = function( evt, sender )
Binds the function to the specified event on the given element.
addListener: function()
Removes the specified listener from the given element.
removeListener: function()
Removes all listeners from the given element.
removeAllListeners: function( element )
Adds the given listeners for touch, mouse and/or pointer events.
addGestureListeners: function( node, startListener, moveListener, endListener )
Removes the given listeners from mousedown, mousemove, mouseup and the respective touch events if mxClient.IS_TOUCH is true.
removeGestureListeners: function( node, startListener, moveListener, endListener )
Redirects the mouse events from the given DOM node to the graph dispatch loop using the event and given state as event arguments.
redirectMouseEvents: function( node, graph, state, down, move, up, dblClick )
Removes the known listeners from the given DOM node and its descendants.
release: function( element )
Disables the context menu for the given element.
disableContextMenu: function( element )
Returns true if the event has been consumed using consume.
isConsumed: function( evt )
Consumes the given event.
consume: function( evt, preventDefault, stopPropagation )
Returns true if the event was generated using a touch device (not a pen or mouse).
isTouchEvent: function( evt )
Returns true if the event was generated using a pen (not a touch device or mouse).
isPenEvent: function( evt )
Returns true if the event was generated using a touch device (not a pen or mouse).
isMultiTouchEvent: function( evt )
Returns true if the event was generated using a mouse (not a pen or touch device).
isMouseEvent: function( evt )
Returns true if the left mouse button is pressed for the given event.
isLeftMouseButton: function( evt )
Returns true if the middle mouse button is pressed for the given event.
isMiddleMouseButton: function( evt )
Returns true if the right mouse button was pressed.
isRightMouseButton: function( evt )
Returns true if the event is a popup trigger.
isPopupTrigger: function( evt )
Returns true if the shift key is pressed for the given event.
isShiftDown: function( evt )
Returns true if the alt key is pressed for the given event.
isAltDown: function( evt )
Returns true if the control key is pressed for the given event.
isControlDown: function( evt )
Returns true if the meta key is pressed for the given event.
isMetaDown: function( evt )
Returns the touch or mouse event that contains the mouse coordinates.
getMainEvent: function( e )
Returns true if the meta key is pressed for the given event.
getClientX: function( e )
Returns true if the meta key is pressed for the given event.
getClientY: function( e )
Specifies the event name for reset.
RESET: 'reset' }
Constructs an XML HTTP request.
function mxXmlRequest( url, params, method, async, username, password )
Holds the target URL of the request.
mxXmlRequest.prototype.url
Holds the form encoded data for the POST request.
mxXmlRequest.prototype.params
Specifies the request method.
mxXmlRequest.prototype.method
Boolean indicating if the request is asynchronous.
mxXmlRequest.prototype.async
Boolean indicating if the request is binary.
mxXmlRequest.prototype.binary
Specifies if withCredentials should be used in HTML5-compliant browsers.
mxXmlRequest.prototype.withCredentials
Specifies the username to be used for authentication.
mxXmlRequest.prototype.username
Specifies the password to be used for authentication.
mxXmlRequest.prototype.password
Holds the inner, browser-specific request object.
mxXmlRequest.prototype.request
Specifies if request values should be decoded as URIs before setting the textarea value in simulate.
mxXmlRequest.prototype.decodeSimulateValues
Returns binary.
mxXmlRequest.prototype.isBinary = function()
Sets binary.
mxXmlRequest.prototype.setBinary = function( value )
Returns the response as a string.
mxXmlRequest.prototype.getText = function()
Returns true if the response is ready.
mxXmlRequest.prototype.isReady = function()
Returns the document element of the response XML document.
mxXmlRequest.prototype.getDocumentElement = function()
Returns the response as an XML document.
mxXmlRequest.prototype.getXml = function()
Returns the status as a number, eg.
mxXmlRequest.prototype.getStatus = function()
Creates and returns the inner request object.
mxXmlRequest.prototype.create = function()
Send the request to the target URL using the specified functions to process the response asychronously.
mxXmlRequest.prototype.send = function( onload, onerror, timeout, ontimeout )
Sets the headers for the given request and parameters.
mxXmlRequest.prototype.setRequestHeaders = function( request, params )
Sets the cells in the clipboard.
setCells: function( cells )
Returns the cells in the clipboard.
getCells: function()
Returns true if the clipboard currently has not data stored.
isEmpty: function()
Cuts the given array of mxCells from the specified graph.
cut: function( graph, cells )
Hook to remove the given cells from the given graph after a cut operation.
removeCells: function( graph, cells )
Copies the given array of mxCells from the specified graph to cells.
copy: function( graph, cells )
Pastes the cells into the specified graph restoring the relation to parents, if possible.
paste: function( graph )
Constructs a new window with the given dimension and title to display the specified content.
function mxWindow( title, content, x, y, width, height, minimizable, movable, replaceNode, style )
URL of the image to be used for the close icon in the titlebar.
mxWindow.prototype.closeImage
URL of the image to be used for the minimize icon in the titlebar.
mxWindow.prototype.minimizeImage
URL of the image to be used for the normalize icon in the titlebar.
mxWindow.prototype.normalizeImage
URL of the image to be used for the maximize icon in the titlebar.
mxWindow.prototype.maximizeImage
Boolean flag that represents the visible state of the window.
mxWindow.prototype.visible
mxRectangle that specifies the minimum width and height of the window.
mxWindow.prototype.minimumSize
Specifies if the window should be destroyed when it is closed.
mxWindow.prototype.destroyOnClose
Defines the correction factor for computing the height of the contentWrapper.
mxWindow.prototype.contentHeightCorrection
Reference to the DOM node (TD) that contains the title.
mxWindow.prototype.title
Reference to the DOM node that represents the window content.
mxWindow.prototype.content
Initializes the DOM tree that represents the window.
mxWindow.prototype.init = function( x, y, width, height, style )
Sets the window title to the given string.
mxWindow.prototype.setTitle = function( title )
Sets if the window contents should be scrollable.
mxWindow.prototype.setScrollable = function( scrollable )
Puts the window on top of all other windows.
mxWindow.prototype.activate = function()
Returuns the outermost DOM node that makes up the window.
mxWindow.prototype.getElement = function()
Makes sure the window is inside the client area of the window.
mxWindow.prototype.fit = function()
Returns true if the window is resizable.
mxWindow.prototype.isResizable = function()
Sets if the window should be resizable.
mxWindow.prototype.setResizable = function( resizable )
Sets the size of the window.
mxWindow.prototype.setSize = function( width, height )
Sets if the window is minimizable.
mxWindow.prototype.setMinimizable = function( minimizable )
Returns an mxRectangle that specifies the size for the minimized window.
mxWindow.prototype.getMinimumSize = function()
Installs the event listeners required for minimizing the window.
mxWindow.prototype.installMinimizeHandler = function()
Sets if the window is maximizable.
mxWindow.prototype.setMaximizable = function( maximizable )
Installs the event listeners required for maximizing the window.
mxWindow.prototype.installMaximizeHandler = function()
Installs the event listeners required for moving the window.
mxWindow.prototype.installMoveHandler = function()
Sets the upper, left corner of the window.
mxWindow.prototype.setLocation = function( x, y )
Returns the current position on the x-axis.
mxWindow.prototype.getX = function()
Returns the current position on the y-axis.
mxWindow.prototype.getY = function()
Adds the closeImage as a new image node in closeImg and installs the close event.
mxWindow.prototype.installCloseHandler = function()
Sets the image associated with the window.
mxWindow.prototype.setImage = function( image )
Sets the image associated with the window.
mxWindow.prototype.setClosable = function( closable )
Returns true if the window is visible.
mxWindow.prototype.isVisible = function()
Shows or hides the window depending on the given flag.
mxWindow.prototype.setVisible = function( visible )
Shows the window.
mxWindow.prototype.show = function()
Hides the window.
mxWindow.prototype.hide = function()
Destroys the window and removes all associated resources.
mxWindow.prototype.destroy = function()
Creates a HTML table using the specified classname.
function mxForm( className )
Holds the DOM node that represents the table.
mxForm.prototype.table
Holds the DOM node that represents the tbody (table body).
mxForm.prototype.body
Returns the table that contains this form.
mxForm.prototype.getTable = function()
Helper method to add an OK and Cancel button using the respective functions.
mxForm.prototype.addButtons = function( okFunct, cancelFunct )
Adds an input for the given name, type and value and returns it.
mxForm.prototype.addText = function( name, value, type )
Adds a checkbox for the given name and value and returns the textfield.
mxForm.prototype.addCheckbox = function( name, value )
Adds a textarea for the given name and value and returns the textarea.
mxForm.prototype.addTextarea = function( name, value, rows )
Adds a combo for the given name and returns the combo.
mxForm.prototype.addCombo = function( name, isMultiSelect, size )
Adds an option for the given label to the specified combo.
mxForm.prototype.addOption = function( combo, label, value, isSelected )
Adds a new row with the name and the input field in two columns and returns the given input.
mxForm.prototype.addField = function( name, input )
Constructs a new image.
function mxImage( src, width, height )
String that specifies the URL of the image.
mxImage.prototype.src
Integer that specifies the width of the image.
mxImage.prototype.width
Integer that specifies the height of the image.
mxImage.prototype.height
Constructs an object that maintains the size of a div element when the window is being resized.
function mxDivResizer( div, container )
Updates the style of the DIV after the window has been resized.
mxDivResizer.prototype.resize = function()
Hook for subclassers to return the width of the document (without scrollbars).
mxDivResizer.prototype.getDocumentWidth = function()
Hook for subclassers to return the height of the document (without scrollbars).
mxDivResizer.prototype.getDocumentHeight = function()
Constructs a new drag source for the given element.
function mxDragSource( element, dropHandler )
Reference to the DOM node which was made draggable.
mxDragSource.prototype.element
Holds the DOM node that is used to represent the drag preview.
mxDragSource.prototype.dropHandler
mxPoint that specifies the offset of the dragElement.
mxDragSource.prototype.dragOffset
Holds the DOM node that is used to represent the drag preview.
mxDragSource.prototype.dragElement
Optional mxRectangle that specifies the unscaled size of the preview.
mxDragSource.prototype.previewElement
Specifies if this drag source is enabled.
mxDragSource.prototype.enabled
Reference to the mxGraph that is the current drop target.
mxDragSource.prototype.currentGraph
Holds the current drop target under the mouse.
mxDragSource.prototype.currentDropTarget
Holds the current drop location.
mxDragSource.prototype.currentPoint
Holds an mxGuide for the currentGraph if dragPreview is not null.
mxDragSource.prototype.currentGuide
Specifies if the graph should scroll automatically.
mxDragSource.prototype.autoscroll
Specifies if mxGuide should be enabled.
mxDragSource.prototype.guidesEnabled
Specifies if the grid should be allowed.
mxDragSource.prototype.gridEnabled
Specifies if drop targets should be highlighted.
mxDragSource.prototype.highlightDropTargets
ZIndex for the drag element.
mxDragSource.prototype.dragElementZIndex
Opacity of the drag element in %.
mxDragSource.prototype.dragElementOpacity
Whether the event source should be checked in graphContainerEvent.
mxDragSource.prototype.checkEventSource
Returns enabled.
mxDragSource.prototype.isEnabled = function()
Sets enabled.
mxDragSource.prototype.setEnabled = function( value )
Returns guidesEnabled.
mxDragSource.prototype.isGuidesEnabled = function()
Sets guidesEnabled.
mxDragSource.prototype.setGuidesEnabled = function( value )
Returns gridEnabled.
mxDragSource.prototype.isGridEnabled = function()
Sets gridEnabled.
mxDragSource.prototype.setGridEnabled = function( value )
Returns the graph for the given mouse event.
mxDragSource.prototype.getGraphForEvent = function( evt )
Returns the drop target for the given graph and coordinates.
mxDragSource.prototype.getDropTarget = function( graph, x, y, evt )
Creates and returns a clone of the dragElementPrototype or the element if the former is not defined.
mxDragSource.prototype.createDragElement = function( evt )
Creates and returns an element which can be used as a preview in the given graph.
mxDragSource.prototype.createPreviewElement = function( graph )
Returns true if this drag source is active.
mxDragSource.prototype.isActive = function()
Stops and removes everything and restores the state of the object.
mxDragSource.prototype.reset = function()
Returns the drop target for the given graph and coordinates.
mxDragSource.prototype.mouseDown = function( evt )
Creates the dragElement using createDragElement.
mxDragSource.prototype.startDrag = function( evt )
Invokes removeDragElement.
mxDragSource.prototype.stopDrag = function()
Removes and destroys the dragElement.
mxDragSource.prototype.removeDragElement = function()
Returns the topmost element under the given event.
mxDragSource.prototype.getElementForEvent = function( evt )
Returns true if the given graph contains the given event.
mxDragSource.prototype.graphContainsEvent = function( graph, evt )
Gets the graph for the given event using getGraphForEvent, updates the currentGraph, calling dragEnter and dragExit on the new and old graph, respectively, and invokes dragOver if currentGraph is not null.
mxDragSource.prototype.mouseMove = function( evt )
Actives the given graph as a drop target.
mxDragSource.prototype.dragEnter = function( graph, evt )
Deactivates the given graph as a drop target.
mxDragSource.prototype.dragExit = function( graph, evt )
Implements autoscroll, updates the currentPoint, highlights any drop targets and updates the preview.
mxDragSource.prototype.dragOver = function( graph, evt )
Processes the mouse up event and invokes drop, dragExit and stopDrag as required.
mxDragSource.prototype.mouseUp = function( evt )
Returns the drop target for the given graph and coordinates.
mxDragSource.prototype.drop = function( graph, evt, dropTarget, x, y )
Actives the given graph as a drop target.
mxDragSource.prototype.removeListeners = function()
Constructs a toolbar in the specified container.
function mxToolbar( container )
Reference to the DOM nodes that contains the toolbar.
mxToolbar.prototype.container
Specifies if events are handled.
mxToolbar.prototype.enabled
Specifies if resetMode requires a forced flag of true for resetting the current mode in the toolbar.
mxToolbar.prototype.noReset
Selects the default mode and resets the state of the previously selected mode.
mxToolbar.prototype.resetMode = function( forced )
Boolean indicating if the default mode should be the last selected switch mode or the first inserted switch mode.
mxToolbar.prototype.updateDefaultMode
Adds the given function as an image with the specified title and icon and returns the new image node.
mxToolbar.prototype.addItem = function( title, icon, funct, pressedIcon, style, factoryMethod )
Adds and returns a new SELECT element using the given style.
mxToolbar.prototype.addCombo = function( style )
Adds and returns a new OPTION element inside the given SELECT element.
mxToolbar.prototype.addOption = function( combo, title, value )
Adds a new selectable item to the toolbar.
mxToolbar.prototype.addSwitchMode = function( title, icon, funct, pressedIcon, style )
Adds a new item to the toolbar.
mxToolbar.prototype.addMode = function( title, icon, funct, pressedIcon, style, toggle )
Resets the state of the previously selected mode and displays the given DOM node as selected.
mxToolbar.prototype.selectMode = function( domNode, funct )
Adds the specifies image as a separator.
mxToolbar.prototype.addSeparator = function( icon )
Adds a break to the container.
mxToolbar.prototype.addBreak = function()
Adds a horizontal line to the container.
mxToolbar.prototype.addLine = function()
Removes the toolbar and all its associated resources.
mxToolbar.prototype.destroy = function ()
Undoes all changes in this edit.
mxUndoableEdit.prototype.undo = function()
Redoes all changes in this edit.
mxUndoableEdit.prototype.redo = function()
Constructs a new undoable edit for the given source.
function mxUndoableEdit( source, significant )
Specifies the source of the edit.
mxUndoableEdit.prototype.source
Array that contains the changes that make up this edit.
mxUndoableEdit.prototype.changes
Specifies if the undoable change is significant.
mxUndoableEdit.prototype.significant
Specifies if this edit has been undone.
mxUndoableEdit.prototype.undone
Specifies if this edit has been redone.
mxUndoableEdit.prototype.redone
Returns true if the this edit contains no changes.
mxUndoableEdit.prototype.isEmpty = function()
Returns significant.
mxUndoableEdit.prototype.isSignificant = function()
Adds the specified change to this edit.
mxUndoableEdit.prototype.add = function( change )
Hook to notify any listeners of the changes after an undo or redo has been carried out.
mxUndoableEdit.prototype.notify = function()
Hook to free resources after the edit has been removed from the command history.
mxUndoableEdit.prototype.die = function()
Clears the command history.
mxUndoManager.prototype.clear = function()
Undoes the last change.
mxUndoManager.prototype.undo = function()
Redoes the last change.
mxUndoManager.prototype.redo = function()
Constructs a new undo manager with the given history size.
function mxUndoManager( size )
Maximum command history size.
mxUndoManager.prototype.size
Array that contains the steps of the command history.
mxUndoManager.prototype.history
Index of the element to be added next.
mxUndoManager.prototype.indexOfNextAdd
Returns true if the history is empty.
mxUndoManager.prototype.isEmpty = function()
Returns true if an undo is possible.
mxUndoManager.prototype.canUndo = function()
Returns true if a redo is possible.
mxUndoManager.prototype.canRedo = function()
Method to be called to add new undoable edits to the history.
mxUndoManager.prototype.undoableEditHappened = function( undoableEdit )
Removes all pending steps after indexOfNextAdd from the history, invoking die on each edit.
mxUndoManager.prototype.trim = function()
Specifies if the converter is enabled.
mxUrlConverter.prototype.enabled
Specifies the base URL to be used as a prefix for relative URLs.
mxUrlConverter.prototype.baseUrl
Specifies the base domain to be used as a prefix for absolute URLs.
mxUrlConverter.prototype.baseDomain
Private helper function to update the base URL.
mxUrlConverter.prototype.updateBaseUrl = function()
Returns enabled.
mxUrlConverter.prototype.isEnabled = function()
Sets enabled.
mxUrlConverter.prototype.setEnabled = function( value )
Returns baseUrl.
mxUrlConverter.prototype.getBaseUrl = function()
Sets baseUrl.
mxUrlConverter.prototype.setBaseUrl = function( value )
Returns baseDomain.
mxUrlConverter.prototype.getBaseDomain = function()
Sets baseDomain.
mxUrlConverter.prototype.setBaseDomain = function( value )
Returns true if the given URL is relative.
mxUrlConverter.prototype.isRelativeUrl = function( url )
Converts the given URL to an absolute URL with protol and domain.
mxUrlConverter.prototype.convert = function( url )
Damper value for the panning.
mxPanningManager.prototype.damper
Delay in milliseconds for the panning.
mxPanningManager.prototype.delay
Specifies if mouse events outside of the component should be handled.
mxPanningManager.prototype.handleMouseOut
Border to handle automatic panning inside the component.
mxPanningManager.prototype.border
Shows the popup menu for the given event and cell.
mxPopupMenu.prototype.popup = function( x, y, cell, evt )
URL of the image to be used for the submenu icon.
mxPopupMenu.prototype.submenuImage
Specifies the zIndex for the popupmenu and its shadow.
mxPopupMenu.prototype.zIndex
Function that is used to create the popup menu.
mxPopupMenu.prototype.factoryMethod
Specifies if popupmenus should be activated by clicking the left mouse button.
mxPopupMenu.prototype.useLeftButtonForPopup
Specifies if events are handled.
mxPopupMenu.prototype.enabled
Contains the number of times addItem has been called for a new menu.
mxPopupMenu.prototype.itemCount
Adds the given item to the given parent item.
mxPopupMenu.prototype.addItem = function( title, image, funct, parent, iconCls, enabled, active )
Specifies if submenus should be expanded on mouseover.
mxPopupMenu.prototype.autoExpand
Specifies if separators should only be added if a menu item follows them.
mxPopupMenu.prototype.smartSeparators
Specifies if any labels should be visible.
mxPopupMenu.prototype.labels
Initializes the shapes required for this vertex handler.
mxPopupMenu.prototype.init = function()
Returns true if events are handled.
mxPopupMenu.prototype.isEnabled = function()
Enables or disables event handling.
mxPopupMenu.prototype.setEnabled = function( enabled )
Returns true if the given event is a popupmenu trigger for the optional given cell.
mxPopupMenu.prototype.isPopupTrigger = function( me )
Creates the nodes required to add submenu items inside the given parent item.
mxPopupMenu.prototype.createSubmenu = function( parent )
Shows the submenu inside the given parent row.
mxPopupMenu.prototype.showSubmenu = function( parent, row )
Adds a horizontal separator in the given parent item or the top-level menu if no parent is specified.
mxPopupMenu.prototype.addSeparator = function( parent, force )
Returns true if the menu is showing.
mxPopupMenu.prototype.isMenuShowing = function()
Shows the menu.
mxPopupMenu.prototype.showMenu = function()
Removes the menu and all submenus.
mxPopupMenu.prototype.hideMenu = function()
Removes all submenus inside the given parent.
mxPopupMenu.prototype.hideSubmenu = function( parent )
Destroys the handler and all its resources and DOM nodes.
mxPopupMenu.prototype.destroy = function()
Constructs a new automatic layout for the given graph.
function mxAutoSaveManager( graph )
Reference to the enclosing mxGraph.
mxAutoSaveManager.prototype.graph
Minimum amount of seconds between two consecutive autosaves.
mxAutoSaveManager.prototype.autoSaveDelay
Minimum amount of seconds between two consecutive autosaves triggered by more than autoSaveThreshhold changes within a timespan of less than autoSaveDelay seconds.
mxAutoSaveManager.prototype.autoSaveThrottle
Minimum amount of ignored changes before an autosave.
mxAutoSaveManager.prototype.autoSaveThreshold
Counter for ignored changes in autosave.
mxAutoSaveManager.prototype.ignoredChanges
Used for autosaving.
mxAutoSaveManager.prototype.lastSnapshot
Specifies if event handling is enabled.
mxAutoSaveManager.prototype.enabled
Holds the function that handles graph model changes.
mxAutoSaveManager.prototype.changeHandler
Returns true if events are handled.
mxAutoSaveManager.prototype.isEnabled = function()
Enables or disables event handling.
mxAutoSaveManager.prototype.setEnabled = function( value )
Sets the graph that the layouts operate on.
mxAutoSaveManager.prototype.setGraph = function( graph )
Empty hook that is called if the graph should be saved.
mxAutoSaveManager.prototype.save = function()
Invoked when the graph model has changed.
mxAutoSaveManager.prototype.graphModelChanged = function( changes )
Resets all counters.
mxAutoSaveManager.prototype.reset = function()
Removes all handlers from the graph and deletes the reference to it.
mxAutoSaveManager.prototype.destroy = function()
Constructs an animation.
function mxAnimation( delay )
Specifies the delay between the animation steps.
mxAnimation.prototype.delay
Reference to the thread while the animation is running.
mxAnimation.prototype.thread
Returns true if the animation is running.
mxAnimation.prototype.isRunning = function()
Starts the animation by repeatedly invoking updateAnimation.
mxAnimation.prototype.startAnimation = function()
Hook for subclassers to implement the animation.
mxAnimation.prototype.updateAnimation = function()
Stops the animation by deleting the timer and fires an mxEvent.DONE.
mxAnimation.prototype.stopAnimation = function()
Constructs an animation.
function mxMorphing( graph, steps, ease, delay )
Specifies the delay between the animation steps.
mxMorphing.prototype.graph
Specifies the maximum number of steps for the morphing.
mxMorphing.prototype.steps
Contains the current step.
mxMorphing.prototype.step
Ease-off for movement towards the given vector.
mxMorphing.prototype.ease
Optional array of cells to be animated.
mxMorphing.prototype.cells
Animation step.
mxMorphing.prototype.updateAnimation = function()
Shows the changes in the given mxCellStatePreview.
mxMorphing.prototype.show = function( move )
Animates the given cell state using mxCellStatePreview.moveState.
mxMorphing.prototype.animateCell = function( cell, move, recurse )
mxCellStatePreview.prototype.moveState = function( state, dx, dy, add, includeEdges )
Returns true if the animation should not recursively find more deltas for children if the given parent state has been animated.
mxMorphing.prototype.stopRecursion = function( state, delta )
Returns the vector between the current rendered state and the future location of the state after the display will be updated.
mxMorphing.prototype.getDelta = function( state )
Returns the top, left corner of the given cell.
mxMorphing.prototype.getOriginForCell = function( cell )
Maps from keys to images.
mxImageBundle.prototype.images
Adds the specified entry to the map.
mxImageBundle.prototype.putImage = function( key, value, fallback )
Returns the value for the given key.
mxImageBundle.prototype.getImage = function( key )
Constructs a new image export.
function mxImageExport()
Specifies if overlays should be included in the export.
mxImageExport.prototype.includeOverlays
Draws the given state and all its descendants to the given canvas.
mxImageExport.prototype.drawState = function( state, canvas )
Returns the link for the given cell state and canvas.
mxImageExport.prototype.getLinkForCellState = function( state, canvas )
Draws the given state to the given canvas.
mxImageExport.prototype.drawCellState = function( state, canvas )
Draws the shape of the given state.
mxImageExport.prototype.drawShape = function( state, canvas )
Draws the text of the given state.
mxImageExport.prototype.drawText = function( state, canvas )
Draws the overlays for the given state.
mxImageExport.prototype.drawOverlays = function( state, canvas )
Constructs a new abstract canvas.
function mxAbstractCanvas2D()
Holds the mxUrlConverter to convert image URLs.
this.converter
Holds the current state.
mxAbstractCanvas2D.prototype.state
Stack of states.
mxAbstractCanvas2D.prototype.states
Holds the current path as an array.
mxAbstractCanvas2D.prototype.path
Switch for rotation of HTML.
mxAbstractCanvas2D.prototype.rotateHtml
Holds the last x coordinate.
mxAbstractCanvas2D.prototype.lastX
Holds the last y coordinate.
mxAbstractCanvas2D.prototype.lastY
Contains the string used for moving in paths.
mxAbstractCanvas2D.prototype.moveOp
Contains the string used for moving in paths.
mxAbstractCanvas2D.prototype.lineOp
Contains the string used for quadratic paths.
mxAbstractCanvas2D.prototype.quadOp
Contains the string used for bezier curves.
mxAbstractCanvas2D.prototype.curveOp
Holds the operator for closing curves.
mxAbstractCanvas2D.prototype.closeOp
Boolean value that specifies if events should be handled.
mxAbstractCanvas2D.prototype.pointerEvents
Create a new mxUrlConverter and returns it.
mxAbstractCanvas2D.prototype.createUrlConverter = function()
Resets the state of this canvas.
mxAbstractCanvas2D.prototype.reset = function()
Creates the state of the this canvas.
mxAbstractCanvas2D.prototype.createState = function()
Rounds all numbers to integers.
mxAbstractCanvas2D.prototype.format = function( value )
Adds the given operation to the path.
mxAbstractCanvas2D.prototype.addOp = function()
Rotates the given point and returns the result as an mxPoint.
mxAbstractCanvas2D.prototype.rotatePoint = function( x, y, theta, cx, cy )
Saves the current state.
mxAbstractCanvas2D.prototype.save = function()
Restores the current state.
mxAbstractCanvas2D.prototype.restore = function()
Sets the current link.
mxAbstractCanvas2D.prototype.setLink = function( link )
Scales the current state.
mxAbstractCanvas2D.prototype.scale = function( value )
Translates the current state.
mxAbstractCanvas2D.prototype.translate = function( dx, dy )
Rotates the current state.
mxAbstractCanvas2D.prototype.rotate = function( theta, flipH, flipV, cx, cy )
Sets the current alpha.
mxAbstractCanvas2D.prototype.setAlpha = function( value )
Sets the current solid fill alpha.
mxAbstractCanvas2D.prototype.setFillAlpha = function( value )
Sets the current stroke alpha.
mxAbstractCanvas2D.prototype.setStrokeAlpha = function( value )
Sets the current fill color.
mxAbstractCanvas2D.prototype.setFillColor = function( value )
Sets the current gradient.
mxAbstractCanvas2D.prototype.setGradient = function( color1, color2, x, y, w, h, direction, alpha1, alpha2 )
Sets the current stroke color.
mxAbstractCanvas2D.prototype.setStrokeColor = function( value )
Sets the current stroke width.
mxAbstractCanvas2D.prototype.setStrokeWidth = function( value )
Enables or disables dashed lines.
mxAbstractCanvas2D.prototype.setDashed = function( value, fixDash )
Sets the current dash pattern.
mxAbstractCanvas2D.prototype.setDashPattern = function( value )
Sets the current line cap.
mxAbstractCanvas2D.prototype.setLineCap = function( value )
Sets the current line join.
mxAbstractCanvas2D.prototype.setLineJoin = function( value )
Sets the current miter limit.
mxAbstractCanvas2D.prototype.setMiterLimit = function( value )
Sets the current font color.
mxAbstractCanvas2D.prototype.setFontColor = function( value )
Sets the current font size.
mxAbstractCanvas2D.prototype.setFontSize = function( value )
Sets the current font family.
mxAbstractCanvas2D.prototype.setFontFamily = function( value )
Sets the current font style.
mxAbstractCanvas2D.prototype.setFontStyle = function( value )
Enables or disables and configures the current shadow.
mxAbstractCanvas2D.prototype.setShadow = function( enabled )
Enables or disables and configures the current shadow.
mxAbstractCanvas2D.prototype.setShadowColor = function( value )
Enables or disables and configures the current shadow.
mxAbstractCanvas2D.prototype.setShadowAlpha = function( value )
Enables or disables and configures the current shadow.
mxAbstractCanvas2D.prototype.setShadowOffset = function( dx, dy )
Starts a new path.
mxAbstractCanvas2D.prototype.begin = function()
Moves the current path the given coordinates.
mxAbstractCanvas2D.prototype.moveTo = function( x, y )
Draws a line to the given coordinates.
mxAbstractCanvas2D.prototype.lineTo = function( x, y )
Adds a quadratic curve to the current path.
mxAbstractCanvas2D.prototype.quadTo = function( x1, y1, x2, y2 )
Adds a bezier curve to the current path.
mxAbstractCanvas2D.prototype.curveTo = function( x1, y1, x2, y2, x3, y3 )
Adds the given arc to the current path.
mxAbstractCanvas2D.prototype.arcTo = function( rx, ry, angle, largeArcFlag, sweepFlag, x, y )
Closes the current path.
mxAbstractCanvas2D.prototype.close = function( x1, y1, x2, y2, x3, y3 )
Empty implementation for backwards compatibility.
mxAbstractCanvas2D.prototype.end = function()
Constructs a new abstract canvas.
function mxXmlCanvas2D( root )
Reference to the container for the SVG content.
this.root
Specifies if text output should be enabled.
mxXmlCanvas2D.prototype.textEnabled
Specifies if the output should be compressed by removing redundant calls.
mxXmlCanvas2D.prototype.compressed
mxXmlCanvas2D.prototype.writeDefaults = function()
Returns a formatted number with 2 decimal places.
mxXmlCanvas2D.prototype.format = function( value )
Creates the given element using the owner document of root.
mxXmlCanvas2D.prototype.createElement = function( name )
Saves the drawing state.
mxXmlCanvas2D.prototype.save = function()
Restores the drawing state.
mxXmlCanvas2D.prototype.restore = function()
Scales the output.
mxXmlCanvas2D.prototype.scale = function( value )
Translates the output.
mxXmlCanvas2D.prototype.translate = function( dx, dy )
Rotates and/or flips the output around a given center.
mxXmlCanvas2D.prototype.rotate = function( theta, flipH, flipV, cx, cy )
Sets the current alpha.
mxXmlCanvas2D.prototype.setAlpha = function( value )
Sets the current fill alpha.
mxXmlCanvas2D.prototype.setFillAlpha = function( value )
Sets the current stroke alpha.
mxXmlCanvas2D.prototype.setStrokeAlpha = function( value )
Sets the current fill color.
mxXmlCanvas2D.prototype.setFillColor = function( value )
Sets the gradient.
mxXmlCanvas2D.prototype.setGradient = function( color1, color2, x, y, w, h, direction, alpha1, alpha2 )
Sets the current stroke color.
mxXmlCanvas2D.prototype.setStrokeColor = function( value )
Sets the current stroke width.
mxXmlCanvas2D.prototype.setStrokeWidth = function( value )
Enables or disables dashed lines.
mxXmlCanvas2D.prototype.setDashed = function( value, fixDash )
Sets the current dash pattern.
mxXmlCanvas2D.prototype.setDashPattern = function( value )
Sets the line cap.
mxXmlCanvas2D.prototype.setLineCap = function( value )
Sets the line join.
mxXmlCanvas2D.prototype.setLineJoin = function( value )
Sets the miter limit.
mxXmlCanvas2D.prototype.setMiterLimit = function( value )
Sets the current font color.
mxXmlCanvas2D.prototype.setFontColor = function( value )
Sets the current font background color.
mxXmlCanvas2D.prototype.setFontBackgroundColor = function( value )
Sets the current font border color.
mxXmlCanvas2D.prototype.setFontBorderColor = function( value )
Sets the current font size.
mxXmlCanvas2D.prototype.setFontSize = function( value )
Sets the current font family.
mxXmlCanvas2D.prototype.setFontFamily = function( value )
Sets the current font style.
mxXmlCanvas2D.prototype.setFontStyle = function( value )
Enables or disables shadows.
mxXmlCanvas2D.prototype.setShadow = function( value )
Sets the current shadow color.
mxXmlCanvas2D.prototype.setShadowColor = function( value )
Sets the current shadows alpha.
mxXmlCanvas2D.prototype.setShadowAlpha = function( value )
Sets the current shadow offset.
mxXmlCanvas2D.prototype.setShadowOffset = function( dx, dy )
Puts a rectangle into the drawing buffer.
mxXmlCanvas2D.prototype.rect = function( x, y, w, h )
Puts a rounded rectangle into the drawing buffer.
mxXmlCanvas2D.prototype.roundrect = function( x, y, w, h, dx, dy )
Puts an ellipse into the drawing buffer.
mxXmlCanvas2D.prototype.ellipse = function( x, y, w, h )
Paints an image.
mxXmlCanvas2D.prototype.image = function( x, y, w, h, src, aspect, flipH, flipV )
Starts a new path and puts it into the drawing buffer.
mxXmlCanvas2D.prototype.begin = function()
Moves the current path the given point.
mxXmlCanvas2D.prototype.moveTo = function( x, y )
Draws a line to the given coordinates.
mxXmlCanvas2D.prototype.lineTo = function( x, y )
Adds a quadratic curve to the current path.
mxXmlCanvas2D.prototype.quadTo = function( x1, y1, x2, y2 )
Adds a bezier curve to the current path.
mxXmlCanvas2D.prototype.curveTo = function( x1, y1, x2, y2, x3, y3 )
Closes the current path.
mxXmlCanvas2D.prototype.close = function()
Paints the given text.
mxXmlCanvas2D.prototype.text = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the outline of the current drawing buffer.
mxXmlCanvas2D.prototype.stroke = function()
Fills the current drawing buffer.
mxXmlCanvas2D.prototype.fill = function()
Fills the current drawing buffer and its outline.
mxXmlCanvas2D.prototype.fillAndStroke = function()
Constructs a new SVG canvas.
function mxSvgCanvas2D( root, styleEnabled )
Reference to the container for the SVG content.
this.root
Local cache of gradients for quick lookups.
this.gradients
Reference to the defs section of the SVG document.
this.defs
Stores the value of styleEnabled passed to the constructor.
this.styleEnabled
Specifies if plain text output should match the vertical HTML alignment.
mxSvgCanvas2D.prototype.matchHtmlAlignment
Specifies if text output should be enabled.
mxSvgCanvas2D.prototype.textEnabled
Specifies if use of foreignObject for HTML markup is allowed.
mxSvgCanvas2D.prototype.foEnabled
Specifies the fallback text for unsupported foreignObjects in exported documents.
mxSvgCanvas2D.prototype.foAltText
Offset to be used for foreignObjects.
mxSvgCanvas2D.prototype.foOffset
Offset to be used for text elements.
mxSvgCanvas2D.prototype.textOffset
Offset to be used for image elements.
mxSvgCanvas2D.prototype.imageOffset
Adds transparent paths for strokes.
mxSvgCanvas2D.prototype.strokeTolerance
Minimum stroke width for output.
mxSvgCanvas2D.prototype.minStrokeWidth
Local counter for references in SVG export.
mxSvgCanvas2D.prototype.refCount
Specifies if a transparent rectangle should be added on top of images to absorb all pointer events.
mxSvgCanvas2D.prototype.blockImagePointerEvents
Correction factor for mxConstants.LINE_HEIGHT in HTML output.
mxSvgCanvas2D.prototype.lineHeightCorrection
Default value for active pointer events.
mxSvgCanvas2D.prototype.pointerEventsValue
Padding to be added for text that is not wrapped to account for differences in font metrics on different platforms in pixels.
mxSvgCanvas2D.prototype.fontMetricsPadding
Specifies if offsetWidth and offsetHeight should be cached.
mxSvgCanvas2D.prototype.cacheOffsetSize
Rounds all numbers to 2 decimal points.
mxSvgCanvas2D.prototype.format = function( value )
Returns the URL of the page without the hash part.
mxSvgCanvas2D.prototype.getBaseUrl = function()
Returns any offsets for rendering pixels.
mxSvgCanvas2D.prototype.reset = function()
Creates the optional style section.
mxSvgCanvas2D.prototype.createStyle = function( x )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.createElement = function( tagName, namespace )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.createGradientId = function( start, end, alpha1, alpha2, direction )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.getSvgGradient = function( start, end, alpha1, alpha2, direction )
Creates the given SVG gradient.
mxSvgCanvas2D.prototype.createSvgGradient = function( start, end, alpha1, alpha2, direction )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.addNode = function( filled, stroked )
Transfers the stroke attributes from state to node.
mxSvgCanvas2D.prototype.updateFill = function()
Returns the current stroke width (>= 1), ie.
mxSvgCanvas2D.prototype.getCurrentStrokeWidth = function()
Transfers the stroke attributes from state to node.
mxSvgCanvas2D.prototype.updateStroke = function()
Transfers the stroke attributes from state to node.
mxSvgCanvas2D.prototype.updateStrokeAttributes = function()
Creates the SVG dash pattern for the given state.
mxSvgCanvas2D.prototype.createDashPattern = function( scale )
Creates a hit detection tolerance shape for the given node.
mxSvgCanvas2D.prototype.createTolerance = function( node )
Creates a shadow for the given node.
mxSvgCanvas2D.prototype.createShadow = function( node )
Experimental implementation for hyperlinks.
mxSvgCanvas2D.prototype.setLink = function( link )
Sets the rotation of the canvas.
mxSvgCanvas2D.prototype.rotate = function( theta, flipH, flipV, cx, cy )
Extends superclass to create path.
mxSvgCanvas2D.prototype.begin = function()
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.rect = function( x, y, w, h )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.roundrect = function( x, y, w, h, dx, dy )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.ellipse = function( x, y, w, h )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.image = function( x, y, w, h, src, aspect, flipH, flipV )
Converts the given HTML string to XHTML.
mxSvgCanvas2D.prototype.convertHtml = function( val )
Private helper function to create SVG elements
mxSvgCanvas2D.prototype.createDiv = function( str, align, valign, style, overflow, whiteSpace )
Paints the given text.
mxSvgCanvas2D.prototype.text = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Creates a clip for the given coordinates.
mxSvgCanvas2D.prototype.createClip = function( x, y, w, h )
Updates the text properties for the given node.
mxSvgCanvas2D.prototype.updateFont = function( node )
Background color and border
mxSvgCanvas2D.prototype.addTextBackground = function( node, str, x, y, w, h, align, valign, overflow )
Paints the outline of the current path.
mxSvgCanvas2D.prototype.stroke = function()
Fills the current path.
mxSvgCanvas2D.prototype.fill = function()
Fills and paints the outline of the current path.
mxSvgCanvas2D.prototype.fillAndStroke = function()
Reference to the container for the SVG content.
this.root
Specifies if text output should be enabledetB.
mxVmlCanvas2D.prototype.textEnabled
Contains the string used for moving in paths.
mxVmlCanvas2D.prototype.moveOp
Contains the string used for moving in paths.
mxVmlCanvas2D.prototype.lineOp
Contains the string used for bezier curves.
mxVmlCanvas2D.prototype.curveOp
Holds the operator for closing curves.
mxVmlCanvas2D.prototype.closeOp
Background color for rotated HTML.
mxVmlCanvas2D.prototype.rotatedHtmlBackground
Specifies the scale used to draw VML shapes.
mxVmlCanvas2D.prototype.vmlScale
Creates the given element using the document.
mxVmlCanvas2D.prototype.createElement = function( name )
Creates a new element using createElement and prefixes the given name with mxClient.VML_PREFIX.
mxVmlCanvas2D.prototype.createVmlElement = function( name )
Adds the current node to the root.
mxVmlCanvas2D.prototype.addNode = function( filled, stroked )
Creates a transparent fill.
mxVmlCanvas2D.prototype.createTransparentFill = function()
Creates a fill for the current state.
mxVmlCanvas2D.prototype.createFill = function()
Creates a fill for the current state.
mxVmlCanvas2D.prototype.createStroke = function()
Creates a shadow for the given node.
mxVmlCanvas2D.prototype.createShadow = function( node, filled, stroked )
Creates the fill for the shadow.
mxVmlCanvas2D.prototype.createShadowFill = function()
Creates the stroke for the shadow.
mxVmlCanvas2D.prototype.createShadowStroke = function()
Sets the rotation of the canvas.
mxVmlCanvas2D.prototype.rotate = function( theta, flipH, flipV, cx, cy )
Extends superclass to create path.
mxVmlCanvas2D.prototype.begin = function()
Replaces quadratic curve with bezier curve in VML.
mxVmlCanvas2D.prototype.quadTo = function( x1, y1, x2, y2 )
Sets the glass gradient.
mxVmlCanvas2D.prototype.createRect = function( nodeName, x, y, w, h )
Sets the current path to a rectangle.
mxVmlCanvas2D.prototype.rect = function( x, y, w, h )
Sets the current path to a rounded rectangle.
mxVmlCanvas2D.prototype.roundrect = function( x, y, w, h, dx, dy )
Sets the current path to an ellipse.
mxVmlCanvas2D.prototype.ellipse = function( x, y, w, h )
Paints an image.
mxVmlCanvas2D.prototype.image = function( x, y, w, h, src, aspect, flipH, flipV )
Paints the given text.
mxVmlCanvas2D.prototype.text = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the outline of the current path.
mxVmlCanvas2D.prototype.plainText = function( x, y, w, h, str, align, valign, wrap, format, overflow, clip, rotation, dir )
Paints the outline of the current path.
mxVmlCanvas2D.prototype.stroke = function()
Fills the current path.
mxVmlCanvas2D.prototype.fill = function()
Fills and paints the outline of the current path.
mxVmlCanvas2D.prototype.fillAndStroke = function()
Constructs a new guide object.
function mxGuide( graph, states )
Reference to the enclosing mxGraph instance.
mxGuide.prototype.graph
Contains the mxCellStates that are used for alignment.
mxGuide.prototype.states
Specifies if horizontal guides are enabled.
mxGuide.prototype.horizontal
Specifies if vertical guides are enabled.
mxGuide.prototype.vertical
Specifies if rounded coordinates should be used.
mxGuide.prototype.rounded
Sets the mxCellStates that should be used for alignment.
mxGuide.prototype.setStates = function( states )
Returns true if the guide should be enabled for the given native event.
mxGuide.prototype.isEnabledForEvent = function( evt )
Returns the tolerance for the guides.
mxGuide.prototype.getGuideTolerance = function()
Returns the mxShape to be used for painting the respective guide.
mxGuide.prototype.createGuideShape = function( horizontal )
Moves the bounds by the given mxPoint and returnt the snapped point.
mxGuide.prototype.move = function( bounds, delta, gridEnabled, clone )
Hides all current guides.
mxGuide.prototype.hide = function()
Shows or hides the current guides.
mxGuide.prototype.setVisible = function( visible )
Destroys all resources that this object uses.
mxGuide.prototype.destroy = function()
Constructs a new shape.
function mxShape( stencil )
Holds the dialect in which the shape is to be painted.
mxShape.prototype.dialect
Holds the scale in which the shape is being painted.
mxShape.prototype.scale
Rendering hint for configuring the canvas.
mxShape.prototype.antiAlias
Minimum stroke width for SVG output.
mxShape.prototype.minSvgStrokeWidth
Holds the mxRectangle that specifies the bounds of this shape.
mxShape.prototype.bounds
Holds the array of mxPoints that specify the points of this shape.
mxShape.prototype.points
Holds the outermost DOM node that represents this shape.
mxShape.prototype.node
Optional reference to the corresponding mxCellState.
mxShape.prototype.state
Optional reference to the style of the corresponding mxCellState.
mxShape.prototype.style
Contains the bounding box of the shape, that is, the smallest rectangle that includes all pixels of the shape.
mxShape.prototype.boundingBox
Holds the mxStencil that defines the shape.
mxShape.prototype.stencil
Event-tolerance for SVG strokes (in px).
mxShape.prototype.svgStrokeTolerance
Specifies if pointer events should be handled.
mxShape.prototype.pointerEvents
Specifies if pointer events should be handled.
mxShape.prototype.svgPointerEvents
Specifies if pointer events outside of shape should be handled.
mxShape.prototype.shapePointerEvents
Specifies if pointer events outside of stencils should be handled.
mxShape.prototype.stencilPointerEvents
Scale for improving the precision of VML rendering.
mxShape.prototype.vmlScale
Specifies if the shape should be drawn as an outline.
mxShape.prototype.outline
Specifies if the shape is visible.
mxShape.prototype.visible
Allows to use the SVG bounding box in SVG.
mxShape.prototype.useSvgBoundingBox
Initializes the shape by creaing the DOM node using create and adding it into the given container.
mxShape.prototype.init = function( container )
Creates and returns the DOM node(s) for the shape in the given container.
mxShape.prototype.create = function( container )
Sets the styles to their default values.
mxShape.prototype.initStyles = function( container )
Specifies if any VML should be added via insertAdjacentHtml to the DOM.
mxShape.prototype.isParseVml = function()
Returns true if HTML is allowed for this shape.
mxShape.prototype.isHtmlAllowed = function()
Returns 0, or 0.5 if strokewidth % 2 == 1.
mxShape.prototype.getSvgScreenOffset = function()
Creates and returns the SVG node(s) to represent this shape.
mxShape.prototype.createSvg = function()
Creates and returns the VML node to represent this shape.
mxShape.prototype.createVml = function()
Creates and returns the HTML DOM node(s) to represent this shape.
mxShape.prototype.createHtml = function()
Reconfigures this shape.
mxShape.prototype.reconfigure = function()
Creates and returns the SVG node(s) to represent this shape.
mxShape.prototype.redraw = function()
Removes all child nodes and resets all CSS.
mxShape.prototype.clear = function()
Updates the bounds based on the points.
mxShape.prototype.updateBoundsFromPoints = function()
Returns the mxRectangle for the label bounds of this shape, based on the given scaled and translated bounds of the shape.
mxShape.prototype.getLabelBounds = function( rect )
Returns the scaled top, left, bottom and right margin to be used for computing the label bounds as an mxRectangle, where the bottom and right margin are defined in the width and height of the rectangle, respectively.
mxShape.prototype.getLabelMargins= function( rect )
Returns true if the bounds are not null and all of its variables are numeric.
mxShape.prototype.checkBounds = function()
Returns the temporary element used for rendering in IE8 standards mode.
mxShape.prototype.createVmlGroup = function()
Updates the SVG or VML shape.
mxShape.prototype.redrawShape = function()
Creates a new canvas for drawing this shape.
mxShape.prototype.createCanvas = function()
Creates and returns an mxSvgCanvas2D for rendering this shape.
mxShape.prototype.createSvgCanvas = function()
Creates and returns an mxVmlCanvas2D for rendering this shape.
mxShape.prototype.createVmlCanvas = function()
Updates the bounds of the VML container.
mxShape.prototype.updateVmlContainer = function()
Allow optimization by replacing VML with HTML.
mxShape.prototype.redrawHtmlShape = function()
Allow optimization by replacing VML with HTML.
mxShape.prototype.updateHtmlFilters = function( node )
Destroys the given canvas which was used for drawing.
mxShape.prototype.destroyCanvas = function( canvas )
Generic rendering code.
mxShape.prototype.paint = function( c )
Sets the state of the canvas for drawing the shape.
mxShape.prototype.configureCanvas = function( c, x, y, w, h )
Returns the bounding box for the gradient box for this shape.
mxShape.prototype.getGradientBounds = function( c, x, y, w, h )
Sets the scale and rotation on the given canvas.
mxShape.prototype.updateTransform = function( c, x, y, w, h )
Paints the vertex shape.
mxShape.prototype.paintVertexShape = function( c, x, y, w, h )
Hook for subclassers.
mxShape.prototype.paintBackground = function( c, x, y, w, h )
Hook for subclassers.
mxShape.prototype.paintForeground = function( c, x, y, w, h )
Hook for subclassers.
mxShape.prototype.paintEdgeShape = function( c, pts )
Returns the arc size for the given dimension.
mxShape.prototype.getArcSize = function( w, h )
Paints the glass gradient effect.
mxShape.prototype.paintGlassEffect = function( c, x, y, w, h, arc )
Paints the given points with rounded corners.
mxShape.prototype.addPoints = function( c, pts, rounded, arcSize, close, exclude, initialMove )
Resets all styles.
mxShape.prototype.resetStyles = function()
Applies the style of the given mxCellState to the shape.
mxShape.prototype.apply = function( state )
Sets the cursor on the given shape.
mxShape.prototype.setCursor = function( cursor )
Returns the current cursor.
mxShape.prototype.getCursor = function()
Hook for subclassers.
mxShape.prototype.isRoundable = function()
Updates the boundingBox for this shape using createBoundingBox and augmentBoundingBox and stores the result in boundingBox.
mxShape.prototype.updateBoundingBox = function()
Returns a new rectangle that represents the bounding box of the bare shape with no shadows or strokewidths.
mxShape.prototype.createBoundingBox = function()
Augments the bounding box with the strokewidth and shadow offsets.
mxShape.prototype.augmentBoundingBox = function( bbox )
Returns true if the bounds should be inverted.
mxShape.prototype.isPaintBoundsInverted = function()
Returns the rotation from the style.
mxShape.prototype.getRotation = function()
Returns the rotation for the text label.
mxShape.prototype.getTextRotation = function()
Returns the actual rotation of the shape.
mxShape.prototype.getShapeRotation = function()
Adds a transparent rectangle that catches all events.
mxShape.prototype.createTransparentSvgRectangle = function( x, y, w, h )
Sets a transparent background CSS style to catch all events.
mxShape.prototype.setTransparentBackgroundImage = function( node )
Paints the line shape.
mxShape.prototype.releaseSvgGradients = function( grads )
Destroys the shape by removing it from the DOM and releasing the DOM node associated with the shape using mxEvent.release.
mxShape.prototype.destroy = function()
Constructs a new generic shape by setting desc to the given XML node and invoking parseDescription and parseConstraints.
function mxStencil( desc )
Holds the XML node with the stencil description.
mxStencil.prototype.desc
Reads w0, h0, aspect, bgNodes and fgNodes from desc.
mxStencil.prototype.parseDescription = function()
Reads the constraints from desc into constraints using parseConstraint.
mxStencil.prototype.parseConstraints = function()
Static global variable that specifies the default value for the localized attribute of the text element.
mxStencil.defaultLocalized
Holds an array of mxConnectionConstraints as defined in the shape.
mxStencil.prototype.constraints
Holds the aspect of the shape.
mxStencil.prototype.aspect
Holds the width of the shape.
mxStencil.prototype.w0
Holds the height of the shape.
mxStencil.prototype.h0
Holds the strokewidth direction from the description.
mxStencil.prototype.strokewidth
Parses the given XML node and returns its mxConnectionConstraint.
mxStencil.prototype.parseConstraint = function( node )
Gets the given attribute as a text.
mxStencil.prototype.evaluateTextAttribute = function( node, attribute, shape )
Gets the attribute for the given name from the given node.
mxStencil.prototype.evaluateAttribute = function( node, attribute, shape )
Draws this stencil inside the given bounds.
mxStencil.prototype.drawShape = function( canvas, shape, x, y, w, h )
Draws this stencil inside the given bounds.
mxStencil.prototype.drawChildren = function( canvas, shape, x, y, w, h, node, aspect, disableShadow, paint )
Returns a rectangle that contains the offset in x and y and the horizontal and vertical scale in width and height used to draw this shape inside the given mxRectangle.
mxStencil.prototype.computeAspect = function( shape, x, y, w, h, direction )
Draws this stencil inside the given bounds.
mxStencil.prototype.drawNode = function( canvas, shape, node, aspect, disableShadow, paint )
Adds the given mxStencil.
addStencil: function( name, stencil )
Returns the mxStencil for the given name.
getStencil: function( name )
Adds a factory method that updates a given endpoint and returns a function to paint the marker onto the given canvas.
addMarker: function( type, funct )
Returns a function to paint the given marker.
createMarker: function( canvas, shape, type, pe, unitX, unitY, size, source, sw, filled )
Constructs a new actor shape.
function mxActor( bounds, fill, stroke, strokewidth )
Redirects to redrawPath for subclasses to work.
mxActor.prototype.paintVertexShape = function( c, x, y, w, h )
Draws the path for this shape.
mxActor.prototype.redrawPath = function( c, x, y, w, h )
Constructs a new cloud shape.
function mxCloud( bounds, fill, stroke, strokewidth )
Draws the path for this shape.
mxCloud.prototype.redrawPath = function( c, x, y, w, h )
Constructs a new rectangle shape.
function mxRectangleShape( bounds, fill, stroke, strokewidth )
Returns true for non-rounded, non-rotated shapes with no glass gradient.
mxRectangleShape.prototype.isHtmlAllowed = function()
Generic background painting implementation.
mxRectangleShape.prototype.paintBackground = function( c, x, y, w, h )
Adds roundable support.
mxRectangleShape.prototype.isRoundable = function( c, x, y, w, h )
Generic background painting implementation.
mxRectangleShape.prototype.paintForeground = function( c, x, y, w, h )
Constructs a new ellipse shape.
function mxEllipse( bounds, fill, stroke, strokewidth )
Paints the ellipse shape.
mxEllipse.prototype.paintVertexShape = function( c, x, y, w, h )
Constructs a new ellipse shape.
function mxDoubleEllipse( bounds, fill, stroke, strokewidth )
Scale for improving the precision of VML rendering.
mxDoubleEllipse.prototype.vmlScale
Paints the background.
mxDoubleEllipse.prototype.paintBackground = function( c, x, y, w, h )
Paints the foreground.
mxDoubleEllipse.prototype.paintForeground = function( c, x, y, w, h )
Returns the bounds for the label.
mxDoubleEllipse.prototype.getLabelBounds = function( rect )
Constructs a new rhombus shape.
function mxRhombus( bounds, fill, stroke, strokewidth )
Adds roundable support.
mxRhombus.prototype.isRoundable = function()
Generic painting implementation.
mxRhombus.prototype.paintVertexShape = function( c, x, y, w, h )
Constructs a new polyline shape.
function mxPolyline( points, stroke, strokewidth )
Returns 0.
mxPolyline.prototype.getRotation = function()
Returns 0.
mxPolyline.prototype.getShapeRotation = function()
Returns false.
mxPolyline.prototype.isPaintBoundsInverted = function()
Paints the line shape.
mxPolyline.prototype.paintEdgeShape = function( c, pts )
Paints the line shape.
mxPolyline.prototype.paintLine = function( c, pts, rounded )
Constructs a new arrow shape.
function mxArrow( points, fill, stroke, strokewidth, arrowWidth, spacing, endSize )
Augments the bounding box with the edge width and markers.
mxArrow.prototype.augmentBoundingBox = function( bbox )
Paints the line shape.
mxArrow.prototype.paintEdgeShape = function( c, pts )
Constructs a new arrow shape.
function mxArrowConnector( points, fill, stroke, strokewidth, arrowWidth, spacing, endSize )
Allows to use the SVG bounding box in SVG.
mxArrowConnector.prototype.useSvgBoundingBox
Overrides mxShape to reset spacing.
mxArrowConnector.prototype.resetStyles
Augments the bounding box with the edge width and markers.
mxArrowConnector.prototype.augmentBoundingBox = function( bbox )
Paints the line shape.
mxArrowConnector.prototype.paintEdgeShape = function( c, pts )
Returns wether the arrow is rounded
mxArrowConnector.prototype.isArrowRounded = function()
Returns the width of the start arrow
mxArrowConnector.prototype.getStartArrowWidth = function()
Returns the width of the end arrow
mxArrowConnector.prototype.getEndArrowWidth = function()
Returns the width of the body of the edge
mxArrowConnector.prototype.getEdgeWidth = function()
Returns whether the ends of the shape are drawn
mxArrowConnector.prototype.isOpenEnded = function()
Returns whether the start marker is drawn
mxArrowConnector.prototype.isMarkerStart = function()
Returns whether the end marker is drawn
mxArrowConnector.prototype.isMarkerEnd = function()
Constructs a new text shape.
function mxText( value, bounds, align, valign, color, family, size, fontStyle, spacing, spacingTop, spacingRight, spacingBottom, spacingLeft, horizontal, background, border, wrap, clipped, overflow, labelPadding, textDirection )
Specifies the spacing to be added to the top spacing.
mxText.prototype.baseSpacingTop
Specifies the spacing to be added to the bottom spacing.
mxText.prototype.baseSpacingBottom
Specifies the spacing to be added to the left spacing.
mxText.prototype.baseSpacingLeft
Specifies the spacing to be added to the right spacing.
mxText.prototype.baseSpacingRight
Specifies if linefeeds in HTML labels should be replaced with BR tags.
mxText.prototype.replaceLinefeeds
Rotation for vertical text.
mxText.prototype.verticalTextRotation
Specifies if the string size should be measured in updateBoundingBox if the label is clipped and the label position is center and middle.
mxText.prototype.ignoreClippedStringSize
Updates the boundingBox for this shape using the given node and position.
mxText.prototype.updateBoundingBox = function()
Specifies if the actual string size should be measured.
mxText.prototype.ignoreStringSize
Specifies the padding to be added to the text width for the bounding box.
mxText.prototype.textWidthPadding
Contains the last rendered text value.
mxText.prototype.lastValue
Specifies if caching for HTML labels should be enabled.
mxText.prototype.cacheEnabled
Text shapes do not contain VML markup and do not need to be parsed.
mxText.prototype.isParseVml = function()
Returns true if HTML is allowed for this shape.
mxText.prototype.isHtmlAllowed = function()
Disables offset in IE9 for crisper image output.
mxText.prototype.getSvgScreenOffset = function()
Returns true if the bounds are not null and all of its variables are numeric.
mxText.prototype.checkBounds = function()
Generic rendering code.
mxText.prototype.paint = function( c, update )
Renders the text using the given DOM nodes.
mxText.prototype.redraw = function()
Resets all styles.
mxText.prototype.resetStyles = function()
Extends mxShape to update the text styles.
mxText.prototype.apply = function( state )
Used to determine the automatic text direction.
mxText.prototype.getAutoDirection = function()
Returns 0 to avoid using rotation in the canvas via updateTransform.
mxText.prototype.getShapeRotation = function()
Returns the rotation for the text label of the corresponding shape.
mxText.prototype.getTextRotation = function()
Inverts the bounds if mxShape.isBoundsInverted returns true or if the horizontal style is false.
mxText.prototype.isPaintBoundsInverted = function()
Sets the state of the canvas for drawing the shape.
mxText.prototype.configureCanvas = function( c, x, y, w, h )
Sets the width and height of the container to 1px.
mxText.prototype.updateVmlContainer = function()
Updates the HTML node(s) to reflect the latest bounds and scale.
mxText.prototype.redrawHtmlShape = function()
Returns the spacing as an mxPoint.
mxText.prototype.updateHtmlTransform = function()
Rotated text rendering quality is bad for IE9 quirks/IE8 standards
mxText.prototype.updateHtmlFilter = function()
Updates the HTML node(s) to reflect the latest bounds and scale.
mxText.prototype.updateValue = function()
Updates the HTML node(s) to reflect the latest bounds and scale.
mxText.prototype.updateFont = function( node )
Updates the HTML node(s) to reflect the latest bounds and scale.
mxText.prototype.updateSize = function( node, enableWrap )
Returns the spacing as an mxPoint.
mxText.prototype.getSpacing = function()
Constructs a new triangle shape.
function mxTriangle()
Adds roundable support.
mxTriangle.prototype.isRoundable = function()
Draws the path for this shape.
mxTriangle.prototype.redrawPath = function( c, x, y, w, h )
Constructs a new hexagon shape.
function mxHexagon()
Draws the path for this shape.
mxHexagon.prototype.redrawPath = function( c, x, y, w, h )
Constructs a new line shape.
function mxLine( bounds, stroke, strokewidth )
Redirects to redrawPath for subclasses to work.
mxLine.prototype.paintVertexShape = function( c, x, y, w, h )
Constructs a new image shape.
function mxImageShape( bounds, image, fill, stroke, strokewidth )
Switch to preserve image aspect.
mxImageShape.prototype.preserveImageAspect
Disables offset in IE9 for crisper image output.
mxImageShape.prototype.getSvgScreenOffset = function()
Overrides mxShape.apply to replace the fill and stroke colors with the respective values from mxConstants.STYLE_IMAGE_BACKGROUND and mxConstants.STYLE_IMAGE_BORDER.
mxImageShape.prototype.apply = function( state )
Returns true if HTML is allowed for this shape.
mxImageShape.prototype.isHtmlAllowed = function()
Creates and returns the HTML DOM node(s) to represent this shape.
mxImageShape.prototype.createHtml = function()
Disables inherited roundable support.
mxImageShape.prototype.isRoundable = function( c, x, y, w, h )
Generic background painting implementation.
mxImageShape.prototype.paintVertexShape = function( c, x, y, w, h )
Overrides mxShape.redraw to preserve the aspect ratio of images.
mxImageShape.prototype.redrawHtmlShape = function()
Constructs a new label shape.
function mxLabel( bounds, fill, stroke, strokewidth )
Default width and height for the image.
mxLabel.prototype.imageSize
Default value for image spacing.
mxLabel.prototype.spacing
Default width and height for the indicicator.
mxLabel.prototype.indicatorSize
Default spacing between image and indicator.
mxLabel.prototype.indicatorSpacing
Initializes the shape and the indicator.
mxLabel.prototype.init = function( container )
Reconfigures this shape.
mxLabel.prototype.redraw = function()
Returns true for non-rounded, non-rotated shapes with no glass gradient and no indicator shape.
mxLabel.prototype.isHtmlAllowed = function()
Generic background painting implementation.
mxLabel.prototype.paintForeground = function( c, x, y, w, h )
Generic background painting implementation.
mxLabel.prototype.paintImage = function( c, x, y, w, h )
Generic background painting implementation.
mxLabel.prototype.getImageBounds = function( x, y, w, h )
Generic background painting implementation.
mxLabel.prototype.paintIndicator = function( c, x, y, w, h )
Generic background painting implementation.
mxLabel.prototype.getIndicatorBounds = function( x, y, w, h )
Generic background painting implementation.
mxLabel.prototype.redrawHtmlShape = function()
Constructs a new cylinder shape.
function mxCylinder( bounds, fill, stroke, strokewidth )
Defines the maximum height of the top and bottom part of the cylinder shape.
mxCylinder.prototype.maxHeight
Sets stroke tolerance to 0 for SVG.
mxCylinder.prototype.svgStrokeTolerance
Redirects to redrawPath for subclasses to work.
mxCylinder.prototype.paintVertexShape = function( c, x, y, w, h )
Draws the path for this shape.
mxCylinder.prototype.redrawPath = function( c, x, y, w, h, isForeground )
Constructs a new connector shape.
function mxConnector( points, stroke, strokewidth )
Updates the boundingBox for this shape using createBoundingBox and augmentBoundingBox and stores the result in boundingBox.
mxConnector.prototype.updateBoundingBox = function()
Augments the bounding box with the strokewidth and shadow offsets.
mxConnector.prototype.augmentBoundingBox = function( bbox )
Paints the line shape.
mxConnector.prototype.paintEdgeShape = function( c, pts )
Prepares the marker by adding offsets in pts and returning a function to paint the marker.
mxConnector.prototype.createMarker = function( c, pts, source )
Constructs a new swimlane shape.
function mxSwimlane( bounds, fill, stroke, strokewidth )
Default imagewidth and imageheight if an image but no imagewidth and imageheight are defined in the style.
mxSwimlane.prototype.imageSize
Adds roundable support.
mxSwimlane.prototype.isRoundable = function( c, x, y, w, h )
Returns the bounding box for the gradient box for this shape.
mxSwimlane.prototype.getGradientBounds = function( c, x, y, w, h )
Returns the arcsize for the swimlane.
mxSwimlane.prototype.getArcSize = function( w, h, start )
Paints the swimlane vertex shape.
mxSwimlane.prototype.paintVertexShape = function( c, x, y, w, h )
Paints the swimlane vertex shape.
mxSwimlane.prototype.paintSwimlane = function( c, x, y, w, h, start, fill, swimlaneLine )
Paints the swimlane vertex shape.
mxSwimlane.prototype.paintRoundedSwimlane = function( c, x, y, w, h, start, r, fill, swimlaneLine )
Paints the divider between swimlane title and content area.
mxSwimlane.prototype.paintDivider = function( c, x, y, w, h, start, shadow )
Paints the vertical or horizontal separator line between swimlanes.
mxSwimlane.prototype.paintSeparator = function( c, x, y, w, h, start, color )
Paints the swimlane vertex shape.
mxSwimlane.prototype.getImageBounds = function( x, y, w, h )
Constructs a new layout using the given layouts.
function mxGraphLayout( graph )
Reference to the enclosing mxGraph.
mxGraphLayout.prototype.graph
Boolean indicating if the bounding box of the label should be used if its available.
mxGraphLayout.prototype.useBoundingBox
The parent cell of the layout, if any
mxGraphLayout.prototype.parent
Notified when a cell is being moved in a parent that has automatic layout to update the cell state (eg.
mxGraphLayout.prototype.moveCell = function( cell, x, y )
Executes the layout algorithm for the children of the given parent.
mxGraphLayout.prototype.execute = function( parent )
Returns the graph that this layout operates on.
mxGraphLayout.prototype.getGraph = function()
Returns the constraint for the given key and cell.
mxGraphLayout.prototype.getConstraint = function( key, cell, edge, source )
Traverses the (directed) graph invoking the given function for each visited vertex and edge.
mxGraphLayout.traverse = function( vertex, directed, func, edge, visited )
Returns true if the given parent is an ancestor of the given child.
mxGraphLayout.prototype.isAncestor = function( parent, child, traverseAncestors )
Returns a boolean indicating if the given mxCell is movable or bendable by the algorithm.
mxGraphLayout.prototype.isVertexMovable = function( cell )
Returns a boolean indicating if the given mxCell should be ignored by the algorithm.
mxGraphLayout.prototype.isVertexIgnored = function( vertex )
Returns a boolean indicating if the given mxCell should be ignored by the algorithm.
mxGraphLayout.prototype.isEdgeIgnored = function( edge )
Disables or enables the edge style of the given edge.
mxGraphLayout.prototype.setEdgeStyleEnabled = function( edge, value )
Disables or enables orthogonal end segments of the given edge.
mxGraphLayout.prototype.setOrthogonalEdge = function( edge, value )
Determines the offset of the given parent to the parent of the layout
mxGraphLayout.prototype.getParentOffset = function( parent )
Replaces the array of mxPoints in the geometry of the given edge with the given array of mxPoints.
mxGraphLayout.prototype.setEdgePoints = function( edge, points )
Sets the new position of the given cell taking into account the size of the bounding box if useBoundingBox is true.
mxGraphLayout.prototype.setVertexLocation = function( cell, x, y )
Returns an mxRectangle that defines the bounds of the given cell or the bounding box if useBoundingBox is true.
mxGraphLayout.prototype.getVertexBounds = function( cell )
Shortcut to mxGraph.updateGroupBounds with moveGroup set to true.
mxGraphLayout.prototype.arrangeGroups = function( cells, border, topBorder, rightBorder, bottomBorder, leftBorder )
Updates the bounds of the given groups to include all children and returns the passed-in cells.
mxGraph.prototype.updateGroupBounds = function( cells, border, moveGroup, topBorder, rightBorder, bottomBorder, leftBorder )
Constructs a new weighted cell sorted for the given cell and weight.
function WeightedCellSorter( cell, weightedValue )
The weighted value of the cell stored.
WeightedCellSorter.prototype.weightedValue
Whether or not to flip equal weight values.
WeightedCellSorter.prototype.nudge
Whether or not this cell has been visited in the current assignment.
WeightedCellSorter.prototype.visited
The index this cell is in the model rank.
WeightedCellSorter.prototype.rankIndex
The cell whose median value is being calculated.
WeightedCellSorter.prototype.cell
Compares two WeightedCellSorters.
WeightedCellSorter.prototype.compare = function( a, b )
Constructs a new stack layout layout for the specified graph, spacing, orientation and offset.
function mxStackLayout( graph, horizontal, spacing, x0, y0, border )
Specifies the orientation of the layout.
mxStackLayout.prototype.horizontal
Specifies the spacing between the cells.
mxStackLayout.prototype.spacing
Specifies the horizontal origin of the layout.
mxStackLayout.prototype.x0
Specifies the vertical origin of the layout.
mxStackLayout.prototype.y0
Border to be added if fill is true.
mxStackLayout.prototype.border
Top margin for the child area.
mxStackLayout.prototype.marginTop
Top margin for the child area.
mxStackLayout.prototype.marginLeft
Top margin for the child area.
mxStackLayout.prototype.marginRight
Top margin for the child area.
mxStackLayout.prototype.marginBottom
Boolean indicating if the location of the first cell should be kept, that is, it will not be moved to x0 or y0.
mxStackLayout.prototype.keepFirstLocation
Boolean indicating if dimension should be changed to fill out the parent cell.
mxStackLayout.prototype.fill
If the parent should be resized to match the width/height of the stack.
mxStackLayout.prototype.resizeParent
Use maximum of existing value and new value for resize of parent.
mxStackLayout.prototype.resizeParentMax
If the last element should be resized to fill out the parent.
mxStackLayout.prototype.resizeLast
Value at which a new column or row should be created.
mxStackLayout.prototype.wrap
If the strokeWidth should be ignored.
mxStackLayout.prototype.borderCollapse
If gaps should be allowed in the stack.
mxStackLayout.prototype.allowGaps
Grid size for alignment of position and size.
mxStackLayout.prototype.gridSize
Returns horizontal.
mxStackLayout.prototype.isHorizontal = function()
Implements mxGraphLayout.moveCell.
mxStackLayout.prototype.moveCell = function( cell, x, y )
Returns the size for the parent container or the size of the graph container if the parent is a layer or the root of the model.
mxStackLayout.prototype.getParentSize = function( parent )
Returns the cells to be layouted.
mxStackLayout.prototype.getLayoutCells = function( parent )
Snaps the given value to the grid size.
mxStackLayout.prototype.snap = function( value )
Implements mxGraphLayout.execute.
mxStackLayout.prototype.execute = function( parent )
Constructs a new stack layout layout for the specified graph, spacing, orientation and offset.
function mxPartitionLayout( graph, horizontal, spacing, border )
Boolean indicating the direction in which the space is partitioned.
mxPartitionLayout.prototype.horizontal
Integer that specifies the absolute spacing in pixels between the children.
mxPartitionLayout.prototype.spacing
Integer that specifies the absolute inset in pixels for the parent that contains the children.
mxPartitionLayout.prototype.border
Boolean that specifies if vertices should be resized.
mxPartitionLayout.prototype.resizeVertices
Returns horizontal.
mxPartitionLayout.prototype.isHorizontal = function()
Implements mxGraphLayout.moveCell.
mxPartitionLayout.prototype.moveCell = function( cell, x, y )
Implements mxGraphLayout.execute.
mxPartitionLayout.prototype.execute = function( parent )
Constructs a new compact tree layout for the specified graph and orientation.
function mxCompactTreeLayout( graph, horizontal, invert )
Specifies the orientation of the layout.
mxCompactTreeLayout.prototype.horizontal
Specifies if edge directions should be inverted.
mxCompactTreeLayout.prototype.invert
If the parents should be resized to match the width/height of the children.
mxCompactTreeLayout.prototype.resizeParent
Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout.
mxCompactTreeLayout.prototype.maintainParentLocation
Padding added to resized parents.
mxCompactTreeLayout.prototype.groupPadding
Top padding added to resized parents.
mxCompactTreeLayout.prototype.groupPaddingTop
Right padding added to resized parents.
mxCompactTreeLayout.prototype.groupPaddingRight
Bottom padding added to resized parents.
mxCompactTreeLayout.prototype.groupPaddingBottom
Left padding added to resized parents.
mxCompactTreeLayout.prototype.groupPaddingLeft
A set of the parents that need updating based on children process as part of the layout.
mxCompactTreeLayout.prototype.parentsChanged
Specifies if the tree should be moved to the top, left corner if it is inside a top-level layer.
mxCompactTreeLayout.prototype.moveTree
Specifies if the tree should be moved to the top, left corner if it is inside a top-level layer.
mxCompactTreeLayout.prototype.visited
Holds the levelDistance.
mxCompactTreeLayout.prototype.levelDistance
Holds the nodeDistance.
mxCompactTreeLayout.prototype.nodeDistance
Specifies if all edge points of traversed edges should be removed.
mxCompactTreeLayout.prototype.resetEdges
The preferred horizontal distance between edges exiting a vertex.
mxCompactTreeLayout.prototype.prefHozEdgeSep
The preferred vertical offset between edges exiting a vertex.
mxCompactTreeLayout.prototype.prefVertEdgeOff
The minimum distance for an edge jetty from a vertex.
mxCompactTreeLayout.prototype.minEdgeJetty
The size of the vertical buffer in the center of inter-rank channels where edge control points should not be placed.
mxCompactTreeLayout.prototype.channelBuffer
Whether or not to apply the internal tree edge routing.
mxCompactTreeLayout.prototype.edgeRouting
Specifies if edges should be sorted according to the order of their opposite terminal cell in the model.
mxCompactTreeLayout.prototype.sortEdges
Whether or not the tops of cells in each rank should be aligned across the rank
mxCompactTreeLayout.prototype.alignRanks
An array of the maximum height of cells (relative to the layout direction) per rank
mxCompactTreeLayout.prototype.maxRankHeight
The cell to use as the root of the tree
mxCompactTreeLayout.prototype.root
The internal node representation of the root cell.
mxCompactTreeLayout.prototype.node
Returns a boolean indicating if the given mxCell should be ignored as a vertex.
mxCompactTreeLayout.prototype.isVertexIgnored = function( vertex )
Returns horizontal.
mxCompactTreeLayout.prototype.isHorizontal = function()
Implements mxGraphLayout.execute.
mxCompactTreeLayout.prototype.execute = function( parent, root )
Moves the specified node and all of its children by the given amount.
mxCompactTreeLayout.prototype.moveNode = function( node, dx, dy )
Called if sortEdges is true to sort the array of outgoing edges in place.
mxCompactTreeLayout.prototype.sortOutgoingEdges = function( source, edges )
Stores the maximum height (relative to the layout direction) of cells in each rank
mxCompactTreeLayout.prototype.findRankHeights = function( node, rank )
Set the cells heights (relative to the layout direction) when the tops of each rank are to be aligned
mxCompactTreeLayout.prototype.setCellHeights = function( node, rank )
Does a depth first search starting at the specified cell.
mxCompactTreeLayout.prototype.dfs = function( cell, parent )
Starts the actual compact tree layout algorithm at the given node.
mxCompactTreeLayout.prototype.layout = function( node )
mxCompactTreeLayout.prototype.horizontalLayout = function( node, x0, y0, bounds )
mxCompactTreeLayout.prototype.verticalLayout = function( node, parent, x0, y0, bounds )
mxCompactTreeLayout.prototype.attachParent = function( node, height )
mxCompactTreeLayout.prototype.layoutLeaf = function( node )
mxCompactTreeLayout.prototype.join = function( node )
mxCompactTreeLayout.prototype.merge = function( p1, p2 )
mxCompactTreeLayout.prototype.offset = function( p1, p2, a1, a2, b1, b2 )
mxCompactTreeLayout.prototype.bridge = function( line1, x1, y1, line2, x2, y2 )
mxCompactTreeLayout.prototype.createNode = function( cell )
mxCompactTreeLayout.prototype.apply = function( node, bounds )
mxCompactTreeLayout.prototype.createLine = function( dx, dy, next )
Adjust parent cells whose child geometries have changed.
mxCompactTreeLayout.prototype.adjustParents = function()
Moves the specified node and all of its children by the given amount.
mxCompactTreeLayout.prototype.localEdgeProcessing = function( node )
Constructs a new radial tree layout for the specified graph
function mxRadialTreeLayout( graph )
The initial offset to compute the angle position.
mxRadialTreeLayout.prototype.angleOffset
The X co-ordinate of the root cell
mxRadialTreeLayout.prototype.rootx
The Y co-ordinate of the root cell
mxRadialTreeLayout.prototype.rooty
Holds the levelDistance.
mxRadialTreeLayout.prototype.levelDistance
Holds the nodeDistance.
mxRadialTreeLayout.prototype.nodeDistance
Specifies if the radios should be computed automatically
mxRadialTreeLayout.prototype.autoRadius
Specifies if edges should be sorted according to the order of their opposite terminal cell in the model.
mxRadialTreeLayout.prototype.sortEdges
Array of leftmost x coordinate of each row
mxRadialTreeLayout.prototype.rowMinX
Array of rightmost x coordinate of each row
mxRadialTreeLayout.prototype.rowMaxX
Array of x coordinate of leftmost vertex of each row
mxRadialTreeLayout.prototype.rowMinCenX
Array of x coordinate of rightmost vertex of each row
mxRadialTreeLayout.prototype.rowMaxCenX
Array of y deltas of each row behind root vertex, also the radius in the tree
mxRadialTreeLayout.prototype.rowRadi
Array of vertices on each row
mxRadialTreeLayout.prototype.row
Returns a boolean indicating if the given mxCell should be ignored as a vertex.
mxRadialTreeLayout.prototype.isVertexIgnored = function( vertex )
Implements mxGraphLayout.execute.
mxRadialTreeLayout.prototype.execute = function( parent, root )
Recursive function to calculate the dimensions of each row
mxRadialTreeLayout.prototype.calcRowDims = function( row, rowNum )
Specifies if the top left corner of the input cells should be the origin of the layout result.
mxFastOrganicLayout.prototype.useInputOrigin
Specifies if all edge points of traversed edges should be removed.
mxFastOrganicLayout.prototype.resetEdges
Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result.
mxFastOrganicLayout.prototype.disableEdgeStyle
The force constant by which the attractive forces are divided and the replusive forces are multiple by the square of.
mxFastOrganicLayout.prototype.forceConstant
Cache of <forceConstant>^2 for performance.
mxFastOrganicLayout.prototype.forceConstantSquared
Minimal distance limit.
mxFastOrganicLayout.prototype.minDistanceLimit
Cached version of minDistanceLimit squared.
mxFastOrganicLayout.prototype.minDistanceLimitSquared
Start value of temperature.
mxFastOrganicLayout.prototype.initialTemp
Temperature to limit displacement at later stages of layout.
mxFastOrganicLayout.prototype.temperature
Total number of iterations to run the layout though.
mxFastOrganicLayout.prototype.maxIterations
Current iteration count.
mxFastOrganicLayout.prototype.iteration
An array of all vertices to be laid out.
mxFastOrganicLayout.prototype.vertexArray
An array of locally stored X co-ordinate displacements for the vertices.
mxFastOrganicLayout.prototype.dispX
An array of locally stored Y co-ordinate displacements for the vertices.
mxFastOrganicLayout.prototype.dispY
An array of locally stored co-ordinate positions for the vertices.
mxFastOrganicLayout.prototype.cellLocation
The approximate radius of each cell, nodes only.
mxFastOrganicLayout.prototype.radius
The approximate radius squared of each cell, nodes only.
mxFastOrganicLayout.prototype.radiusSquared
Array of booleans representing the movable states of the vertices.
mxFastOrganicLayout.prototype.isMoveable
Local copy of cell neighbours.
mxFastOrganicLayout.prototype.neighbours
Hashtable from cells to local indices.
mxFastOrganicLayout.prototype.indices
Boolean flag that specifies if the layout is allowed to run.
mxFastOrganicLayout.prototype.allowedToRun
Returns a boolean indicating if the given mxCell should be ignored as a vertex.
mxFastOrganicLayout.prototype.isVertexIgnored = function( vertex )
Implements mxGraphLayout.execute.
mxFastOrganicLayout.prototype.execute = function( parent )
Takes the displacements calculated for each cell and applies them to the local cache of cell positions.
mxFastOrganicLayout.prototype.calcPositions = function()
Calculates the attractive forces between all laid out nodes linked by edges
mxFastOrganicLayout.prototype.calcAttraction = function()
Calculates the repulsive forces between all laid out nodes
mxFastOrganicLayout.prototype.calcRepulsion = function()
Reduces the temperature of the layout from an initial setting in a linear fashion to zero.
mxFastOrganicLayout.prototype.reduceTemperature = function()
Constructs a new circular layout for the specified radius.
function mxCircleLayout( graph, radius )
Integer specifying the size of the radius.
mxCircleLayout.prototype.radius
Boolean specifying if the circle should be moved to the top, left corner specified by x0 and y0.
mxCircleLayout.prototype.moveCircle
Integer specifying the left coordinate of the circle.
mxCircleLayout.prototype.x0
Integer specifying the top coordinate of the circle.
mxCircleLayout.prototype.y0
Specifies if all edge points of traversed edges should be removed.
mxCircleLayout.prototype.resetEdges
Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result.
mxCircleLayout.prototype.disableEdgeStyle
Implements mxGraphLayout.execute.
mxCircleLayout.prototype.execute = function( parent )
Returns the radius to be used for the given vertex count.
mxCircleLayout.prototype.getRadius = function( count, max )
Executes the circular layout for the specified array of vertices and the given radius.
mxCircleLayout.prototype.circle = function( vertices, r, left, top )
Defines the spacing between the parallels.
mxParallelEdgeLayout.prototype.spacing
Implements mxGraphLayout.execute.
mxParallelEdgeLayout.prototype.execute = function( parent )
Finds the parallel edges in the given parent.
mxParallelEdgeLayout.prototype.findParallels = function( parent )
Returns a unique ID for the given edge.
mxParallelEdgeLayout.prototype.getEdgeId = function( edge )
Lays out the parallel edges in the given array.
mxParallelEdgeLayout.prototype.layout = function( parallels )
Routes the given edge via the given point.
mxParallelEdgeLayout.prototype.route = function( edge, x, y )
Constructs a new layout using the given layouts.
function mxCompositeLayout( graph, layouts, master )
Holds the array of mxGraphLayouts that this layout contains.
mxCompositeLayout.prototype.layouts
Implements mxGraphLayout.moveCell by calling move on master or the first layout in layouts.
mxCompositeLayout.prototype.moveCell = function( cell, x, y )
Implements mxGraphLayout.execute by executing all layouts in a single transaction.
mxCompositeLayout.prototype.execute = function( parent )
Constructs a new edge label layout.
function mxEdgeLabelLayout( graph, radius )
Implements mxGraphLayout.execute.
mxEdgeLabelLayout.prototype.execute = function( parent )
Places the labels of the given edges.
mxEdgeLabelLayout.prototype.placeLabels = function( v, e )
Places the labels of the given edges.
mxEdgeLabelLayout.prototype.avoid = function( edge, vertex )
Constructs a new hierarchical layout algorithm.
function mxGraphAbstractHierarchyCell()
The maximum rank this cell occupies.
mxGraphAbstractHierarchyCell.prototype.maxRank
The minimum rank this cell occupies.
mxGraphAbstractHierarchyCell.prototype.minRank
The x position of this cell for each layer it occupies
mxGraphAbstractHierarchyCell.prototype.x
The y position of this cell for each layer it occupies
mxGraphAbstractHierarchyCell.prototype.y
The width of this cell
mxGraphAbstractHierarchyCell.prototype.width
The height of this cell
mxGraphAbstractHierarchyCell.prototype.height
A cached version of the cells this cell connects to on the next layer up
mxGraphAbstractHierarchyCell.prototype.nextLayerConnectedCells
A cached version of the cells this cell connects to on the next layer down
mxGraphAbstractHierarchyCell.prototype.previousLayerConnectedCells
Temporary variable for general use.
mxGraphAbstractHierarchyCell.prototype.temp
Returns the cells this cell connects to on the next layer up
mxGraphAbstractHierarchyCell.prototype.getNextLayerConnectedCells = function( layer )
Returns the cells this cell connects to on the next layer down
mxGraphAbstractHierarchyCell.prototype.getPreviousLayerConnectedCells = function( layer )
Returns whether or not this cell is an edge
mxGraphAbstractHierarchyCell.prototype.isEdge = function()
Returns whether or not this cell is a node
mxGraphAbstractHierarchyCell.prototype.isVertex = function()
Gets the value of temp for the specified layer
mxGraphAbstractHierarchyCell.prototype.getGeneralPurposeVariable = function( layer )
Set the value of temp for the specified layer
mxGraphAbstractHierarchyCell.prototype.setGeneralPurposeVariable = function( layer, value )
Set the value of x for the specified layer
mxGraphAbstractHierarchyCell.prototype.setX = function( layer, value )
Gets the value of x on the specified layer
mxGraphAbstractHierarchyCell.prototype.getX = function( layer )
Set the value of y for the specified layer
mxGraphAbstractHierarchyCell.prototype.setY = function( layer, value )
Constructs an internal node to represent the specified real graph cell
function mxGraphHierarchyNode( cell )
The graph cell this object represents.
mxGraphHierarchyNode.prototype.cell
The object identity of the wrapped cell
mxGraphHierarchyNode.prototype.id
Collection of hierarchy edges that have this node as a target
mxGraphHierarchyNode.prototype.connectsAsTarget
Collection of hierarchy edges that have this node as a source
mxGraphHierarchyNode.prototype.connectsAsSource
Assigns a unique hashcode for each node.
mxGraphHierarchyNode.prototype.hashCode
Returns the integer value of the layer that this node resides in
mxGraphHierarchyNode.prototype.getRankValue = function( layer )
Returns the cells this cell connects to on the next layer up
mxGraphHierarchyNode.prototype.getNextLayerConnectedCells = function( layer )
Returns the cells this cell connects to on the next layer down
mxGraphHierarchyNode.prototype.getPreviousLayerConnectedCells = function( layer )
Returns true.
mxGraphHierarchyNode.prototype.isVertex = function()
Gets the value of temp for the specified layer
mxGraphHierarchyNode.prototype.getGeneralPurposeVariable = function( layer )
Set the value of temp for the specified layer
mxGraphHierarchyNode.prototype.setGeneralPurposeVariable = function( layer, value )
mxGraphHierarchyNode.prototype.isAncestor = function( otherNode )
Gets the core vertex associated with this wrapper
mxGraphHierarchyNode.prototype.getCoreCell = function()
Constructs a hierarchy edge
function mxGraphHierarchyEdge( edges )
The graph edge(s) this object represents.
mxGraphHierarchyEdge.prototype.edges
The object identities of the wrapped cells
mxGraphHierarchyEdge.prototype.ids
The node this edge is sourced at
mxGraphHierarchyEdge.prototype.source
The node this edge targets
mxGraphHierarchyEdge.prototype.target
Whether or not the direction of this edge has been reversed internally to create a DAG for the hierarchical layout
mxGraphHierarchyEdge.prototype.isReversed
Inverts the direction of this internal edge(s)
mxGraphHierarchyEdge.prototype.invert = function( layer )
Returns the cells this cell connects to on the next layer up
mxGraphHierarchyEdge.prototype.getNextLayerConnectedCells = function( layer )
Returns the cells this cell connects to on the next layer down
mxGraphHierarchyEdge.prototype.getPreviousLayerConnectedCells = function( layer )
Returns true.
mxGraphHierarchyEdge.prototype.isEdge = function()
Gets the value of temp for the specified layer
mxGraphHierarchyEdge.prototype.getGeneralPurposeVariable = function( layer )
Set the value of temp for the specified layer
mxGraphHierarchyEdge.prototype.setGeneralPurposeVariable = function( layer, value )
Gets the first core edge associated with this wrapper
mxGraphHierarchyEdge.prototype.getCoreCell = function()
Creates an internal ordered graph model using the vertices passed in.
function mxGraphHierarchyModel( layout, vertices, roots, parent, tightenToSource )
Stores the largest rank number allocated
mxGraphHierarchyModel.prototype.maxRank
Map from graph vertices to internal model nodes.
mxGraphHierarchyModel.prototype.vertexMapper
Map from graph edges to internal model edges
mxGraphHierarchyModel.prototype.edgeMapper
Mapping from rank number to actual rank
mxGraphHierarchyModel.prototype.ranks
Store of roots of this hierarchy model, these are real graph cells, not internal cells
mxGraphHierarchyModel.prototype.roots
The parent cell whose children are being laid out
mxGraphHierarchyModel.prototype.parent
Count of the number of times the ancestor dfs has been used.
mxGraphHierarchyModel.prototype.dfsCount
High value to start source layering scan rank value from.
mxGraphHierarchyModel.prototype.SOURCESCANSTARTRANK
Whether or not to tighten the assigned ranks of vertices up towards the source cells.
mxGraphHierarchyModel.prototype.tightenToSource
Creates all edges in the internal model
mxGraphHierarchyModel.prototype.createInternalCells = function( layout, vertices, internalVertices )
Basic determination of minimum layer ranking by working from from sources or sinks and working through each node in the relevant edge direction.
mxGraphHierarchyModel.prototype.initialRank = function()
Fixes the layer assignments to the values stored in the nodes.
mxGraphHierarchyModel.prototype.fixRanks = function()
A depth first search through the internal heirarchy model.
mxGraphHierarchyModel.prototype.visit = function( visitor, dfsRoots, trackAncestors, seenNodes )
Performs a depth first search on the internal hierarchy model
mxGraphHierarchyModel.prototype.dfs = function( parent, root, connectingEdge, visitor, seen, layer )
Performs a depth first search on the internal hierarchy model.
mxGraphHierarchyModel.prototype.extendedDfs = function( parent, root, connectingEdge, visitor, seen, ancestors, childHash, layer )
Creates an internal ordered graph model using the vertices passed in.
function mxSwimlaneModel( layout, vertices, roots, parent, tightenToSource )
Stores the largest rank number allocated
mxSwimlaneModel.prototype.maxRank
Map from graph vertices to internal model nodes.
mxSwimlaneModel.prototype.vertexMapper
Map from graph edges to internal model edges
mxSwimlaneModel.prototype.edgeMapper
Mapping from rank number to actual rank
mxSwimlaneModel.prototype.ranks
Store of roots of this hierarchy model, these are real graph cells, not internal cells
mxSwimlaneModel.prototype.roots
The parent cell whose children are being laid out
mxSwimlaneModel.prototype.parent
Count of the number of times the ancestor dfs has been used.
mxSwimlaneModel.prototype.dfsCount
High value to start source layering scan rank value from.
mxSwimlaneModel.prototype.SOURCESCANSTARTRANK
Whether or not to tighten the assigned ranks of vertices up towards the source cells.
mxSwimlaneModel.prototype.tightenToSource
An array of the number of ranks within each swimlane
mxSwimlaneModel.prototype.ranksPerGroup
Creates all edges in the internal model
mxSwimlaneModel.prototype.createInternalCells = function( layout, vertices, internalVertices )
Basic determination of minimum layer ranking by working from from sources or sinks and working through each node in the relevant edge direction.
mxSwimlaneModel.prototype.initialRank = function()
Performs a depth first search on the internal hierarchy model.
mxSwimlaneModel.prototype.maxChainDfs = function( parent, root, connectingEdge, seen, chainCount )
Fixes the layer assignments to the values stored in the nodes.
mxSwimlaneModel.prototype.fixRanks = function()
A depth first search through the internal heirarchy model.
mxSwimlaneModel.prototype.visit = function( visitor, dfsRoots, trackAncestors, seenNodes )
Performs a depth first search on the internal hierarchy model
mxSwimlaneModel.prototype.dfs = function( parent, root, connectingEdge, visitor, seen, layer )
Performs a depth first search on the internal hierarchy model.
mxSwimlaneModel.prototype.extendedDfs = function( parent, root, connectingEdge, visitor, seen, ancestors, childHash, layer )
Constructs a new hierarchical layout stage.
function mxHierarchicalLayoutStage()
Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use.
mxHierarchicalLayoutStage.prototype.execute = function( parent )
Creates a coordinate assignment.
function mxMedianHybridCrossingReduction( layout )
Reference to the enclosing mxHierarchicalLayout.
mxMedianHybridCrossingReduction.prototype.layout
The maximum number of iterations to perform whilst reducing edge crossings.
mxMedianHybridCrossingReduction.prototype.maxIterations
Stores each rank as a collection of cells in the best order found for each layer so far
mxMedianHybridCrossingReduction.prototype.nestedBestRanks
The total number of crossings found in the best configuration so far
mxMedianHybridCrossingReduction.prototype.currentBestCrossings
The total number of crossings found in the best configuration so far
mxMedianHybridCrossingReduction.prototype.iterationsWithoutImprovement
The total number of crossings found in the best configuration so far
mxMedianHybridCrossingReduction.prototype.maxNoImprovementIterations
Performs a vertex ordering within ranks as described by Gansner et al 1993
mxMedianHybridCrossingReduction.prototype.execute = function( parent )
Calculates the total number of edge crossing in the current graph.
mxMedianHybridCrossingReduction.prototype.calculateCrossings = function( model )
Calculates the number of edges crossings between the specified rank and the rank below it.
mxMedianHybridCrossingReduction.prototype.calculateRankCrossing = function( i, model )
Takes each possible adjacent cell pair on each rank and checks if swapping them around reduces the number of crossing
mxMedianHybridCrossingReduction.prototype.transpose = function( mainLoopIteration, model )
Sweeps up or down the layout attempting to minimise the median placement of connected cells on adjacent ranks
mxMedianHybridCrossingReduction.prototype.weightedMedian = function( iteration, model )
Attempts to minimise the median placement of connected cells on this rank and one of the adjacent ranks
mxMedianHybridCrossingReduction.prototype.medianRank = function( rankValue, downwardSweep )
Calculates the median rank order positioning for the specified cell using the connected cells on the specified rank.
mxMedianHybridCrossingReduction.prototype.medianValue = function( connectedCells, rankValue )
Constructs a new median cell sorter.
function MedianCellSorter()
The weighted value of the cell stored.
MedianCellSorter.prototype.medianValue
The cell whose median value is being calculated
MedianCellSorter.prototype.cell
Compares two MedianCellSorters.
MedianCellSorter.prototype.compare = function( a, b )
Creates a cycle remover for the given internal model.
function mxMinimumCycleRemover( layout )
Reference to the enclosing mxHierarchicalLayout.
mxMinimumCycleRemover.prototype.layout
Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use.
mxMinimumCycleRemover.prototype.execute = function( parent )
Creates a coordinate assignment.
function mxCoordinateAssignment( layout, intraCellSpacing, interRankCellSpacing, orientation, initialX, parallelEdgeSpacing )
Reference to the enclosing mxHierarchicalLayout.
mxCoordinateAssignment.prototype.layout
The minimum buffer between cells on the same rank.
mxCoordinateAssignment.prototype.intraCellSpacing
The minimum distance between cells on adjacent ranks.
mxCoordinateAssignment.prototype.interRankCellSpacing
The distance between each parallel edge on each ranks for long edges.
mxCoordinateAssignment.prototype.parallelEdgeSpacing
The number of heuristic iterations to run.
mxCoordinateAssignment.prototype.maxIterations
The preferred horizontal distance between edges exiting a vertex
mxCoordinateAssignment.prototype.prefHozEdgeSep
The preferred vertical offset between edges exiting a vertex
mxCoordinateAssignment.prototype.prefVertEdgeOff
The minimum distance for an edge jetty from a vertex
mxCoordinateAssignment.prototype.minEdgeJetty
The size of the vertical buffer in the center of inter-rank channels where edge control points should not be placed
mxCoordinateAssignment.prototype.channelBuffer
Map of internal edges and (x,y) pair of positions of the start and end jetty for that edge where it connects to the source and target vertices.
mxCoordinateAssignment.prototype.jettyPositions
The position of the root ( start ) node(s) relative to the rest of the laid out graph.
mxCoordinateAssignment.prototype.orientation
The minimum x position node placement starts at
mxCoordinateAssignment.prototype.initialX
The maximum x value this positioning lays up to
mxCoordinateAssignment.prototype.limitX
The sum of x-displacements for the current iteration
mxCoordinateAssignment.prototype.currentXDelta
The rank that has the widest x position
mxCoordinateAssignment.prototype.widestRank
Internal cache of top-most values of Y for each rank
mxCoordinateAssignment.prototype.rankTopY
Internal cache of bottom-most value of Y for each rank
mxCoordinateAssignment.prototype.rankBottomY
The X-coordinate of the edge of the widest rank
mxCoordinateAssignment.prototype.widestRankValue
The width of all the ranks
mxCoordinateAssignment.prototype.rankWidths
The Y-coordinate of all the ranks
mxCoordinateAssignment.prototype.rankY
Whether or not to perform local optimisations and iterate multiple times through the algorithm.
mxCoordinateAssignment.prototype.fineTuning
A store of connections to the layer above for speed
mxCoordinateAssignment.prototype.nextLayerConnectedCache
A store of connections to the layer below for speed
mxCoordinateAssignment.prototype.previousLayerConnectedCache
Padding added to resized parents
mxCoordinateAssignment.prototype.groupPadding
A basic horizontal coordinate assignment algorithm
mxCoordinateAssignment.prototype.execute = function( parent )
Performs one median positioning sweep in both directions
mxCoordinateAssignment.prototype.minNode = function( model )
Performs one median positioning sweep in one direction
mxCoordinateAssignment.prototype.medianPos = function( i, model )
Performs median minimisation over one rank.
mxCoordinateAssignment.prototype.rankMedianPosition = function( rankValue, model, nextRankValue )
Calculates the priority the specified cell has based on the type of its cell and the cells it is connected to on the next layer
mxCoordinateAssignment.prototype.calculatedWeightedValue = function( currentCell, collection )
Calculates the median position of the connected cell on the specified rank
mxCoordinateAssignment.prototype.medianXValue = function( connectedCells, rankValue )
Sets up the layout in an initial positioning.
mxCoordinateAssignment.prototype.initialCoords = function( facade, model )
Sets up the layout in an initial positioning.
mxCoordinateAssignment.prototype.rankCoordinates = function( rankValue, graph, model )
Calculates the width rank in the hierarchy.
mxCoordinateAssignment.prototype.calculateWidestRank = function( graph, model )
Straightens out chains of virtual nodes where possibleacade to those stored after this layout processing step has completed.
mxCoordinateAssignment.prototype.minPath = function( graph, model )
Determines whether or not a node may be moved to the specified x position on the specified rank
mxCoordinateAssignment.prototype.repositionValid = function( model, cell, rank, position )
Sets the cell locations in the facade to those stored after this layout processing step has completed.
mxCoordinateAssignment.prototype.setCellLocations = function( graph, model )
Separates the x position of edges as they connect to vertices
mxCoordinateAssignment.prototype.localEdgeProcessing = function( model )
Fixes the control points
mxCoordinateAssignment.prototype.setEdgePosition = function( cell )
Fixes the position of the specified vertex.
mxCoordinateAssignment.prototype.setVertexLocation = function( cell )
Hook to add additional processing
mxCoordinateAssignment.prototype.processReversedEdge = function( graph, model )
Creates a cycle remover for the given internal model.
function mxSwimlaneOrdering( layout )
Reference to the enclosing mxHierarchicalLayout.
mxSwimlaneOrdering.prototype.layout
Takes the graph detail and configuration information within the facade and creates the resulting laid out graph within that facade for further use.
mxSwimlaneOrdering.prototype.execute = function( parent )
Constructs a new hierarchical layout algorithm.
function mxHierarchicalLayout( graph, orientation, deterministic )
Holds the array of mxCell that this layout contains.
mxHierarchicalLayout.prototype.roots
Specifies if the parent should be resized after the layout so that it contains all the child cells.
mxHierarchicalLayout.prototype.resizeParent
Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout.
mxHierarchicalLayout.prototype.maintainParentLocation
Specifies if the parent should be moved if resizeParent is enabled.
mxHierarchicalLayout.prototype.moveParent
The border to be added around the children if the parent is to be resized using resizeParent.
mxHierarchicalLayout.prototype.parentBorder
The spacing buffer added between cells on the same layer.
mxHierarchicalLayout.prototype.intraCellSpacing
The spacing buffer added between cell on adjacent layers.
mxHierarchicalLayout.prototype.interRankCellSpacing
The spacing buffer between unconnected hierarchies.
mxHierarchicalLayout.prototype.interHierarchySpacing
The distance between each parallel edge on each ranks for long edges
mxHierarchicalLayout.prototype.parallelEdgeSpacing
The position of the root node(s) relative to the laid out graph in.
mxHierarchicalLayout.prototype.orientation
Whether or not to perform local optimisations and iterate multiple times through the algorithm.
mxHierarchicalLayout.prototype.fineTuning
Whether or not to tighten the assigned ranks of vertices up towards the source cells.
mxHierarchicalLayout.prototype.tightenToSource
Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result.
mxHierarchicalLayout.prototype.disableEdgeStyle
Whether or not to drill into child cells and layout in reverse group order.
mxHierarchicalLayout.prototype.traverseAncestors
The internal mxGraphHierarchyModel formed of the layout.
mxHierarchicalLayout.prototype.model
The style to apply between cell layers to edge segments
mxHierarchicalLayout.prototype.edgeStyle
Returns the internal mxGraphHierarchyModel for this layout algorithm.
mxHierarchicalLayout.prototype.getModel = function()
Executes the layout for the children of the specified parent.
mxHierarchicalLayout.prototype.execute = function( parent, roots )
Returns all visible children in the given parent which do not have incoming edges.
mxHierarchicalLayout.prototype.findRoots = function( parent, vertices )
Returns the connected edges for the given cell.
mxHierarchicalLayout.prototype.getEdges = function( cell )
Helper function to return visible terminal for edge allowing for ports
mxHierarchicalLayout.prototype.getVisibleTerminal = function( edge, source )
The API method used to exercise the layout upon the graph description and produce a separate description of the vertex position and edge routing changes made.
mxHierarchicalLayout.prototype.run = function( parent )
Creates an array of descendant cells
mxHierarchicalLayout.prototype.filterDescendants = function( cell, result )
Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal
mxHierarchicalLayout.prototype.isPort = function( cell )
Returns the edges between the given source and target.
mxHierarchicalLayout.prototype.getEdgesBetween = function( source, target, directed )
Executes the cycle stage using mxMinimumCycleRemover.
mxHierarchicalLayout.prototype.cycleStage = function( parent )
Implements first stage of a Sugiyama layout.
mxHierarchicalLayout.prototype.layeringStage = function()
Executes the crossing stage using mxMedianHybridCrossingReduction.
mxHierarchicalLayout.prototype.crossingStage = function( parent )
Executes the placement stage using mxCoordinateAssignment.
mxHierarchicalLayout.prototype.placementStage = function( initialX, parent )
Constructs a new hierarchical layout algorithm.
function mxSwimlaneLayout( graph, orientation, deterministic )
Holds the array of mxCell that this layout contains.
mxSwimlaneLayout.prototype.roots
Holds the array of mxCell of the ordered swimlanes to lay out
mxSwimlaneLayout.prototype.swimlanes
Holds an array of mxCell of dummy vertices inserted during the layout to pad out empty swimlanes
mxSwimlaneLayout.prototype.dummyVertices
The cell width of any dummy vertices inserted
mxSwimlaneLayout.prototype.dummyVertexWidth
Specifies if the parent should be resized after the layout so that it contains all the child cells.
mxSwimlaneLayout.prototype.resizeParent
Specifies if the parent location should be maintained, so that the top, left corner stays the same before and after execution of the layout.
mxSwimlaneLayout.prototype.maintainParentLocation
Specifies if the parent should be moved if resizeParent is enabled.
mxSwimlaneLayout.prototype.moveParent
The border to be added around the children if the parent is to be resized using resizeParent.
mxSwimlaneLayout.prototype.parentBorder
The spacing buffer added between cells on the same layer.
mxSwimlaneLayout.prototype.intraCellSpacing
The spacing buffer added between cell on adjacent layers.
mxSwimlaneLayout.prototype.interRankCellSpacing
The spacing buffer between unconnected hierarchies.
mxSwimlaneLayout.prototype.interHierarchySpacing
The distance between each parallel edge on each ranks for long edges
mxSwimlaneLayout.prototype.parallelEdgeSpacing
The position of the root node(s) relative to the laid out graph in.
mxSwimlaneLayout.prototype.orientation
Whether or not to perform local optimisations and iterate multiple times through the algorithm.
mxSwimlaneLayout.prototype.fineTuning
Whether or not to tighten the assigned ranks of vertices up towards the source cells.
mxSwimlaneLayout.prototype.tightenToSource
Specifies if the STYLE_NOEDGESTYLE flag should be set on edges that are modified by the result.
mxSwimlaneLayout.prototype.disableEdgeStyle
Whether or not to drill into child cells and layout in reverse group order.
mxSwimlaneLayout.prototype.traverseAncestors
The internal mxSwimlaneModel formed of the layout.
mxSwimlaneLayout.prototype.model
The style to apply between cell layers to edge segments
mxHierarchicalLayout.prototype.edgeStyle
Returns the internal mxSwimlaneModel for this layout algorithm.
mxSwimlaneLayout.prototype.getModel = function()
Executes the layout for the children of the specified parent.
mxSwimlaneLayout.prototype.execute = function( parent, swimlanes )
Updates the bounds of the given array of groups so that it includes all child vertices.
mxSwimlaneLayout.prototype.updateGroupBounds = function()
Returns all visible children in the given parent which do not have incoming edges.
mxSwimlaneLayout.prototype.findRoots = function( parent, vertices )
Returns the connected edges for the given cell.
mxSwimlaneLayout.prototype.getEdges = function( cell )
Helper function to return visible terminal for edge allowing for ports
mxSwimlaneLayout.prototype.getVisibleTerminal = function( edge, source )
The API method used to exercise the layout upon the graph description and produce a separate description of the vertex position and edge routing changes made.
mxSwimlaneLayout.prototype.run = function( parent )
Creates an array of descendant cells
mxSwimlaneLayout.prototype.filterDescendants = function( cell, result )
Returns true if the given cell is a “port”, that is, when connecting to it, its parent is the connecting vertex in terms of graph traversal
mxSwimlaneLayout.prototype.isPort = function( cell )
Returns the edges between the given source and target.
mxSwimlaneLayout.prototype.getEdgesBetween = function( source, target, directed )
Executes the cycle stage using mxMinimumCycleRemover.
mxSwimlaneLayout.prototype.cycleStage = function( parent )
Implements first stage of a Sugiyama layout.
mxSwimlaneLayout.prototype.layeringStage = function()
Executes the crossing stage using mxMedianHybridCrossingReduction.
mxSwimlaneLayout.prototype.crossingStage = function( parent )
Executes the placement stage using mxCoordinateAssignment.
mxSwimlaneLayout.prototype.placementStage = function( initialX, parent )
Counter for the depth of nested transactions.
mxGraphModel.prototype.updateLevel
Increments the updateLevel by one.
mxGraphModel.prototype.beginUpdate = function()
Decrements the updateLevel by one and fires an undo event if the updateLevel reaches 0.
mxGraphModel.prototype.endUpdate = function()
Constructs a new graph model.
function mxGraphModel( root )
Holds the root cell, which in turn contains the cells that represent the layers of the diagram as child cells.
mxGraphModel.prototype.root
Maps from Ids to cells.
mxGraphModel.prototype.cells
Specifies if edges should automatically be moved into the nearest common ancestor of their terminals.
mxGraphModel.prototype.maintainEdgeParent
Specifies if relative edge parents should be ignored for finding the nearest common ancestors of an edge’s terminals.
mxGraphModel.prototype.ignoreRelativeEdgeParent
Specifies if the model should automatically create Ids for new cells.
mxGraphModel.prototype.createIds
Defines the prefix of new Ids.
mxGraphModel.prototype.prefix
Defines the postfix of new Ids.
mxGraphModel.prototype.postfix
Specifies the next Id to be created.
mxGraphModel.prototype.nextId
Holds the changes for the current transaction.
mxGraphModel.prototype.currentEdit
True if the program flow is currently inside endUpdate.
mxGraphModel.prototype.endingUpdate
Sets a new root using createRoot.
mxGraphModel.prototype.clear = function()
Creates a new root cell with a default layer (child 0).
mxGraphModel.prototype.createRoot = function()
Returns createIds.
mxGraphModel.prototype.isCreateIds = function()
Sets createIds.
mxGraphModel.prototype.setCreateIds = function( value )
Returns the mxCell for the specified Id or null if no cell can be found for the given Id.
mxGraphModel.prototype.getCell = function( id )
Returns the cells from the given array where the given filter function returns true.
mxGraphModel.prototype.filterCells = function( cells, filter )
Returns all descendants of the given cell and the cell itself in an array.
mxGraphModel.prototype.getDescendants = function( parent )
Visits all cells recursively and applies the specified filter function to each cell.
mxGraphModel.prototype.filterDescendants = function( filter, parent )
Returns the root of the model or the topmost parent of the given cell.
mxGraphModel.prototype.getRoot = function( cell )
Sets the root of the model using mxRootChange and adds the change to the current transaction.
mxGraphModel.prototype.setRoot = function( root )
Inner callback to change the root of the model and update the internal datastructures, such as cells and nextId.
mxGraphModel.prototype.rootChanged = function( root )
Returns true if the given cell is the root of the model and a non-null value.
mxGraphModel.prototype.isRoot = function( cell )
Returns true if isRoot returns true for the parent of the given cell.
mxGraphModel.prototype.isLayer = function( cell )
Returns true if the given parent is an ancestor of the given child.
mxGraphModel.prototype.isAncestor = function( parent, child )
Returns true if the model contains the given mxCell.
mxGraphModel.prototype.contains = function( cell )
Returns the parent of the given cell.
mxGraphModel.prototype.getParent = function( cell )
Adds the specified child to the parent at the given index using mxChildChange and adds the change to the current transaction.
mxGraphModel.prototype.add = function( parent, child, index )
Inner callback to update cells when a cell has been added.
mxGraphModel.prototype.cellAdded = function( cell )
Hook method to create an Id for the specified cell.
mxGraphModel.prototype.createId = function( cell )
Updates the parent for all edges that are connected to cell or one of its descendants using updateEdgeParent.
mxGraphModel.prototype.updateEdgeParents = function( cell, root )
Inner callback to update the parent of the specified mxCell to the nearest-common-ancestor of its two terminals.
mxGraphModel.prototype.updateEdgeParent = function( edge, root )
Returns the absolute, accumulated origin for the children inside the given parent as an mxPoint.
mxGraphModel.prototype.getOrigin = function( cell )
Returns the nearest common ancestor for the specified cells.
mxGraphModel.prototype.getNearestCommonAncestor = function( cell1, cell2 )
Removes the specified cell from the model using mxChildChange and adds the change to the current transaction.
mxGraphModel.prototype.remove = function( cell )
Inner callback to update cells when a cell has been removed.
mxGraphModel.prototype.cellRemoved = function( cell )
Inner callback to update the parent of a cell using mxCell.insert on the parent and return the previous parent.
mxGraphModel.prototype.parentForCellChanged = function( cell, parent, index )
Inserts the specified child into the child array at the specified index and updates the parent reference of the child.
mxCell.prototype.insert = function( child, index )
Returns the number of children in the given cell.
mxGraphModel.prototype.getChildCount = function( cell )
Returns the child of the given mxCell at the given index.
mxGraphModel.prototype.getChildAt = function( cell, index )
Returns all children of the given mxCell as an array of mxCells.
mxGraphModel.prototype.getChildren = function( cell )
Returns the child vertices of the given parent.
mxGraphModel.prototype.getChildVertices = function( parent )
Returns the child edges of the given parent.
mxGraphModel.prototype.getChildEdges = function( parent )
Returns the children of the given cell that are vertices and/or edges depending on the arguments.
mxGraphModel.prototype.getChildCells = function( parent, vertices, edges )
Returns the source or target mxCell of the given edge depending on the value of the boolean parameter.
mxGraphModel.prototype.getTerminal = function( edge, isSource )
Sets the source or target terminal of the given mxCell using mxTerminalChange and adds the change to the current transaction.
mxGraphModel.prototype.setTerminal = function( edge, terminal, isSource )
Sets the source and target mxCell of the given mxCell in a single transaction using setTerminal for each end of the edge.
mxGraphModel.prototype.setTerminals = function( edge, source, target )
Inner helper function to update the terminal of the edge using mxCell.insertEdge and return the previous terminal.
mxGraphModel.prototype.terminalForCellChanged = function( edge, terminal, isSource )
Inserts the specified edge into the edge array and returns the edge.
mxCell.prototype.insertEdge = function( edge, isOutgoing )
Returns the number of distinct edges connected to the given cell.
mxGraphModel.prototype.getEdgeCount = function( cell )
Returns the edge of cell at the given index.
mxGraphModel.prototype.getEdgeAt = function( cell, index )
Returns the number of incoming or outgoing edges, ignoring the given edge.
mxGraphModel.prototype.getDirectedEdgeCount = function( cell, outgoing, ignoredEdge )
Returns all edges of the given cell without loops.
mxGraphModel.prototype.getConnections = function( cell )
Returns the incoming edges of the given cell without loops.
mxGraphModel.prototype.getIncomingEdges = function( cell )
Returns the outgoing edges of the given cell without loops.
mxGraphModel.prototype.getOutgoingEdges = function( cell )
Returns all distinct edges connected to this cell as a new array of mxCells.
mxGraphModel.prototype.getEdges = function( cell, incoming, outgoing, includeLoops )
Returns all edges between the given source and target pair.
mxGraphModel.prototype.getEdgesBetween = function( source, target, directed )
Returns all opposite vertices wrt terminal for the given edges, only returning sources and/or targets as specified.
mxGraphModel.prototype.getOpposites = function( edges, terminal, sources, targets )
Returns the topmost cells of the hierarchy in an array that contains no descendants for each mxCell that it contains.
mxGraphModel.prototype.getTopmostCells = function( cells )
Returns true if the given cell is a vertex.
mxGraphModel.prototype.isVertex = function( cell )
Returns true if the given cell is an edge.
mxGraphModel.prototype.isEdge = function( cell )
Returns true if the given mxCell is connectable.
mxGraphModel.prototype.isConnectable = function( cell )
Returns the user object of the given mxCell using mxCell.getValue.
mxGraphModel.prototype.getValue = function( cell )
Returns the user object of the cell.
mxCell.prototype.getValue = function()
Sets the user object of then given mxCell using mxValueChange and adds the change to the current transaction.
mxGraphModel.prototype.setValue = function( cell, value )
Inner callback to update the user object of the given mxCell using mxCell.valueChanged and return the previous value, that is, the return value of mxCell.valueChanged.
mxGraphModel.prototype.valueForCellChanged = function( cell, value )
Changes the user object after an in-place edit and returns the previous value.
mxCell.prototype.valueChanged = function( newValue )
Returns the mxGeometry of the given mxCell.
mxGraphModel.prototype.getGeometry = function( cell )
Sets the mxGeometry of the given mxCell.
mxGraphModel.prototype.setGeometry = function( cell, geometry )
Inner callback to update the mxGeometry of the given mxCell using mxCell.setGeometry and return the previous mxGeometry.
mxGraphModel.prototype.geometryForCellChanged = function( cell, geometry )
Sets the mxGeometry to be used as the geometry.
mxCell.prototype.setGeometry = function( geometry )
Returns the style of the given mxCell.
mxGraphModel.prototype.getStyle = function( cell )
Sets the style of the given mxCell using mxStyleChange and adds the change to the current transaction.
mxGraphModel.prototype.setStyle = function( cell, style )
Inner callback to update the style of the given mxCell using mxCell.setStyle and return the previous style.
mxGraphModel.prototype.styleForCellChanged = function( cell, style )
Sets the string to be used as the style.
mxCell.prototype.setStyle = function( style )
Returns true if the given mxCell is collapsed.
mxGraphModel.prototype.isCollapsed = function( cell )
Sets the collapsed state of the given mxCell using mxCollapseChange and adds the change to the current transaction.
mxGraphModel.prototype.setCollapsed = function( cell, collapsed )
Inner callback to update the collapsed state of the given mxCell using mxCell.setCollapsed and return the previous collapsed state.
mxGraphModel.prototype.collapsedStateForCellChanged = function( cell, collapsed )
Sets the collapsed state.
mxCell.prototype.setCollapsed = function( collapsed )
Returns true if the given mxCell is visible.
mxGraphModel.prototype.isVisible = function( cell )
Sets the visible state of the given mxCell using mxVisibleChange and adds the change to the current transaction.
mxGraphModel.prototype.setVisible = function( cell, visible )
Inner callback to update the visible state of the given mxCell using mxCell.setCollapsed and return the previous visible state.
mxGraphModel.prototype.visibleStateForCellChanged = function( cell, visible )
Executes the given edit and fires events if required.
mxGraphModel.prototype.execute = function( change )
Creates a new mxUndoableEdit that implements the notify function to fire a change and notify event through the mxUndoableEdit’s source.
mxGraphModel.prototype.createUndoableEdit = function( significant )
Merges the children of the given cell into the given target cell inside this model.
mxGraphModel.prototype.mergeChildren = function( from, to, cloneAllEdges )
Returns an array that represents the set (no duplicates) of all parents for the given array of cells.
mxGraphModel.prototype.getParents = function( cells )
Returns a deep clone of the given mxCell (including the children) which is created using cloneCells.
mxGraphModel.prototype.cloneCell = function( cell )
Returns an array of clones for the given array of mxCells.
mxGraphModel.prototype.cloneCells = function( cells, includeChildren, mapping )
Inner helper method for cloning cells recursively.
mxGraphModel.prototype.cloneCellImpl = function( cell, mapping, includeChildren )
Hook for cloning the cell.
mxGraphModel.prototype.cellCloned = function( cell )
Inner helper method for restoring the connections in a network of cloned cells.
mxGraphModel.prototype.restoreClone = function( clone, cell, mapping )
Constructs a change of the root in the specified model.
function mxRootChange( model, root )
Carries out a change of the root using mxGraphModel.rootChanged.
mxRootChange.prototype.execute = function()
Constructs a change of a child in the specified model.
function mxChildChange( model, parent, child, index )
Changes the parent of child using mxGraphModel.parentForCellChanged and removes or restores the cell’s connections.
mxChildChange.prototype.execute = function()
Constructs a change of a terminal in the specified model.
function mxTerminalChange( model, cell, terminal, source )
Changes the terminal of cell to previous using mxGraphModel.terminalForCellChanged.
mxTerminalChange.prototype.execute = function()
Constructs a change of a user object in the specified model.
function mxValueChange( model, cell, value )
Changes the value of cell to previous using mxGraphModel.valueForCellChanged.
mxValueChange.prototype.execute = function()
Constructs a change of a style in the specified model.
function mxStyleChange( model, cell, style )
Changes the style of cell to previous using mxGraphModel.styleForCellChanged.
mxStyleChange.prototype.execute = function()
Constructs a change of a geometry in the specified model.
function mxGeometryChange( model, cell, geometry )
Changes the geometry of cell ro previous using mxGraphModel.geometryForCellChanged.
mxGeometryChange.prototype.execute = function()
Constructs a change of a collapsed state in the specified model.
function mxCollapseChange( model, cell, collapsed )
Changes the collapsed state of cell to previous using mxGraphModel.collapsedStateForCellChanged.
mxCollapseChange.prototype.execute = function()
Constructs a change of a visible state in the specified model.
function mxVisibleChange( model, cell, visible )
Changes the visible state of cell to previous using mxGraphModel.visibleStateForCellChanged.
mxVisibleChange.prototype.execute = function()
Constructs a change of a attribute of the DOM node stored as the value of the given mxCell.
function mxCellAttributeChange( cell, attribute, value )
Changes the attribute of the cell’s user object by using mxCell.setAttribute.
mxCellAttributeChange.prototype.execute = function()
Sets the specified attribute on the user object if it is an XML node.
mxCell.prototype.setAttribute = function( name, value )
Constructs a new cell to be used in a graph model.
function mxCell( value, geometry, style )
Holds the Id.
mxCell.prototype.id
Holds the user object.
mxCell.prototype.value
Holds the mxGeometry.
mxCell.prototype.geometry
Holds the style as a string of the form [(stylename|key=value);].
mxCell.prototype.style
Specifies whether the cell is a vertex.
mxCell.prototype.vertex
Specifies whether the cell is an edge.
mxCell.prototype.edge
Specifies whether the cell is connectable.
mxCell.prototype.connectable
Specifies whether the cell is visible.
mxCell.prototype.visible
Specifies whether the cell is collapsed.
mxCell.prototype.collapsed
Reference to the parent cell.
mxCell.prototype.parent
Reference to the source terminal.
mxCell.prototype.source
Reference to the target terminal.
mxCell.prototype.target
Holds the child cells.
mxCell.prototype.children
Holds the edges.
mxCell.prototype.edges
List of members that should not be cloned inside clone.
mxCell.prototype.mxTransient
Returns a clone of the cell.
mxCell.prototype.clone = function()
Returns the Id of the cell as a string.
mxCell.prototype.getId = function()
Sets the Id of the cell to the given string.
mxCell.prototype.setId = function( id )
Sets the user object of the cell.
mxCell.prototype.setValue = function( value )
Returns the mxGeometry that describes the geometry.
mxCell.prototype.getGeometry = function()
Returns a string that describes the style.
mxCell.prototype.getStyle = function()
Returns true if the cell is a vertex.
mxCell.prototype.isVertex = function()
Specifies if the cell is a vertex.
mxCell.prototype.setVertex = function( vertex )
Returns true if the cell is an edge.
mxCell.prototype.isEdge = function()
Specifies if the cell is an edge.
mxCell.prototype.setEdge = function( edge )
Returns true if the cell is connectable.
mxCell.prototype.isConnectable = function()
Sets the connectable state.
mxCell.prototype.setConnectable = function( connectable )
Returns true if the cell is visibile.
mxCell.prototype.isVisible = function()
Specifies if the cell is visible.
mxCell.prototype.setVisible = function( visible )
Returns true if the cell is collapsed.
mxCell.prototype.isCollapsed = function()
Returns the cell’s parent.
mxCell.prototype.getParent = function()
Sets the parent cell.
mxCell.prototype.setParent = function( parent )
Returns the source or target terminal.
mxCell.prototype.getTerminal = function( source )
Sets the source or target terminal and returns the new terminal.
mxCell.prototype.setTerminal = function( terminal, isSource )
Returns the number of child cells.
mxCell.prototype.getChildCount = function()
Returns the index of the specified child in the child array.
mxCell.prototype.getIndex = function( child )
Returns the child at the specified index.
mxCell.prototype.getChildAt = function( index )
Removes the child at the specified index from the child array and returns the child that was removed.
mxCell.prototype.remove = function( index )
Removes the cell from its parent.
mxCell.prototype.removeFromParent = function()
Returns the number of edges in the edge array.
mxCell.prototype.getEdgeCount = function()
Returns the index of the specified edge in edges.
mxCell.prototype.getEdgeIndex = function( edge )
Returns the edge at the specified index in edges.
mxCell.prototype.getEdgeAt = function( index )
Removes the specified edge from the edge array and returns the edge.
mxCell.prototype.removeEdge = function( edge, isOutgoing )
Removes the edge from its source or target terminal.
mxCell.prototype.removeFromTerminal = function( isSource )
Returns true if the user object is an XML node that contains the given attribute.
mxCell.prototype.hasAttribute = function( name )
Returns the specified attribute from the user object if it is an XML node.
mxCell.prototype.getAttribute = function( name, defaultValue )
Returns a clone of the cell’s user object.
mxCell.prototype.cloneValue = function()
Constructs a new object to describe the size and location of a vertex or the control points of an edge.
function mxGeometry( x, y, width, height )
Global switch to translate the points in translate.
mxGeometry.prototype.TRANSLATE_CONTROL_POINTS
Stores alternate values for x, y, width and height in a rectangle.
mxGeometry.prototype.alternateBounds
Defines the source mxPoint of the edge.
mxGeometry.prototype.sourcePoint
Defines the target mxPoint of the edge.
mxGeometry.prototype.targetPoint
Array of mxPoints which specifies the control points along the edge.
mxGeometry.prototype.points
For edges, this holds the offset (in pixels) from the position defined by x and y on the edge.
mxGeometry.prototype.offset
Specifies if the coordinates in the geometry are to be interpreted as relative coordinates.
mxGeometry.prototype.relative
Swaps the x, y, width and height with the values stored in alternateBounds and puts the previous values into alternateBounds as a rectangle.
mxGeometry.prototype.swap = function()
Returns the mxPoint representing the source or target point of this edge.
mxGeometry.prototype.getTerminalPoint = function( isSource )
Sets the sourcePoint or targetPoint to the given mxPoint and returns the new point.
mxGeometry.prototype.setTerminalPoint = function( point, isSource )
Rotates the geometry by the given angle around the given center.
mxGeometry.prototype.rotate = function( angle, cx )
Translates the geometry by the specified amount.
mxGeometry.prototype.translate = function( dx, dy )
Scales the geometry by the given amount.
mxGeometry.prototype.scale = function( sx, sy, fixedAspect )
Returns true if the given object equals this geometry.
mxGeometry.prototype.equals = function( obj )
Creates the cell path for the given cell.
create: function( cell )
Returns the path for the parent of the cell represented by the given path.
getParentPath: function( path )
Returns the cell for the specified cell path using the given root as the root of the path.
resolve: function( root, path )
Compares the given cell paths and returns -1 if p1 is smaller, 0 if p1 is equal and 1 if p1 is greater than p2.
compare: function( p1, p2 )
Describes a rectangular perimeter for the given bounds.
RectanglePerimeter: function ( bounds, vertex, next, orthogonal )
Describes an elliptic perimeter.
EllipsePerimeter: function ( bounds, vertex, next, orthogonal )
Describes a rhombus (aka diamond) perimeter.
RhombusPerimeter: function ( bounds, vertex, next, orthogonal )
Describes a triangle perimeter.
TrianglePerimeter: function ( bounds, vertex, next, orthogonal )
Describes a hexagon perimeter.
HexagonPerimeter: function ( bounds, vertex, next, orthogonal )
Constructs a new print preview for the given parameters.
function mxPrintPreview( graph, scale, pageFormat, border, x0, y0, borderColor, title, pageSelector )
Reference to the mxGraph that should be previewed.
mxPrintPreview.prototype.graph
Holds the mxRectangle that defines the page format.
mxPrintPreview.prototype.pageFormat
Holds the scale of the print preview.
mxPrintPreview.prototype.scale
The border inset around each side of every page in the preview.
mxPrintPreview.prototype.border
The margin at the top of the page (number).
mxPrintPreview.prototype.marginTop
The margin at the bottom of the page (number).
mxPrintPreview.prototype.marginBottom
Holds the horizontal offset of the output.
mxPrintPreview.prototype.x0
Holds the vertical offset of the output.
mxPrintPreview.prototype.y0
Specifies if the origin should be automatically computed based on the top, left corner of the actual diagram contents.
mxPrintPreview.prototype.autoOrigin
Specifies if overlays should be printed.
mxPrintPreview.prototype.printOverlays
Specifies if controls (such as folding icons) should be printed.
mxPrintPreview.prototype.printControls
Specifies if the background image should be printed.
mxPrintPreview.prototype.printBackgroundImage
Holds the color value for the page background color.
mxPrintPreview.prototype.backgroundColor
Holds the color value for the page border.
mxPrintPreview.prototype.borderColor
Holds the title of the preview window.
mxPrintPreview.prototype.title
Boolean that specifies if the page selector should be displayed.
mxPrintPreview.prototype.pageSelector
Reference to the preview window.
mxPrintPreview.prototype.wnd
Assign any window here to redirect the rendering in open.
mxPrintPreview.prototype.targetWindow
Shows the print preview window.
mxPrintPreview.prototype.open = function( css, targetWindow, forcePageBreaks, keepOpen )
Holds the actual number of pages in the preview.
mxPrintPreview.prototype.pageCount
Specifies is clipping should be used to avoid creating too many cell states in large diagrams.
mxPrintPreview.prototype.clipping
Returns wnd.
mxPrintPreview.prototype.getWindow = function()
Adds the given graph to the existing print preview.
mxPrintPreview.prototype.appendGraph = function( graph, scale, x0, y0, forcePageBreaks, keepOpen )
Adds a page break to the given document.
mxPrintPreview.prototype.addPageBreak = function( doc )
Writes the closing tags for body and page after calling writePostfix.
mxPrintPreview.prototype.closeDocument = function()
Called before closing the body of the page.
mxPrintPreview.prototype.writePostfix = function( doc )
Writes the HEAD section into the given document, without the opening and closing HEAD tags.
mxPrintPreview.prototype.writeHead = function( doc, css )
Creates the page selector table.
mxPrintPreview.prototype.createPageSelector = function( vpages, hpages )
Creates a DIV that prints a single page of the given graph using the given scale and returns the DIV that represents the page.
mxPrintPreview.prototype.renderPage = function( w, h, dx, dy, content, pageNumber )
Returns the root cell for painting the graph.
mxPrintPreview.prototype.getRoot = function()
Adds a graph fragment to the given div.
mxPrintPreview.prototype.addGraphFragment = function( dx, dy, scale, pageNumber, div, clip )
Returns the link for the given cell state.
mxPrintPreview.prototype.getLinkForCellState = function( state )
Inserts the background image into the given div.
mxPrintPreview.prototype.insertBackgroundImage = function( div, dx, dy )
Returns the pages to be added before the print output.
mxPrintPreview.prototype.getCoverPages = function()
Returns the pages to be added after the print output.
mxPrintPreview.prototype.getAppendices = function()
Opens the print preview and shows the print dialog.
mxPrintPreview.prototype.print = function( css )
Closes the print preview window.
mxPrintPreview.prototype.close = function()
Constructs a new stylesheet and assigns default styles.
function mxStylesheet()
Creates and returns the default vertex style.
mxStylesheet.prototype.createDefaultVertexStyle = function()
Creates and returns the default edge style.
mxStylesheet.prototype.createDefaultEdgeStyle = function()
Sets the default style for vertices using defaultVertex as the stylename.
mxStylesheet.prototype.putDefaultVertexStyle = function( style )
Sets the default style for edges using defaultEdge as the stylename.
mxStylesheet.prototype.putDefaultEdgeStyle = function( style )
Returns the default style for vertices.
mxStylesheet.prototype.getDefaultVertexStyle = function()
Sets the default style for edges.
mxStylesheet.prototype.getDefaultEdgeStyle = function()
Stores the given map of key, value pairs under the given name in styles.
mxStylesheet.prototype.putCellStyle = function( name, style )
Returns the cell style for the specified stylename or the given defaultStyle if no style can be found for the given stylename.
mxStylesheet.prototype.getCellStyle = function( name, defaultStyle )
Constructs a new object that represents the current state of the given cell in the specified view.
function mxCellState( view, cell, style )
Reference to the enclosing mxGraphView.
mxCellState.prototype.view
Reference to the mxCell that is represented by this state.
mxCellState.prototype.cell
Contains an array of key, value pairs that represent the style of the cell.
mxCellState.prototype.style
Specifies if the style is invalid.
mxCellState.prototype.invalidStyle
Specifies if the state is invalid.
mxCellState.prototype.invalid
mxPoint that holds the origin for all child cells.
mxCellState.prototype.origin
Holds an array of mxPoints that represent the absolute points of an edge.
mxCellState.prototype.absolutePoints
mxPoint that holds the absolute offset.
mxCellState.prototype.absoluteOffset
Caches the visible source terminal state.
mxCellState.prototype.visibleSourceState
Caches the visible target terminal state.
mxCellState.prototype.visibleTargetState
Caches the distance between the end points for an edge.
mxCellState.prototype.terminalDistance
Caches the length of an edge.
mxCellState.prototype.length
Array of numbers that represent the cached length of each segment of the edge.
mxCellState.prototype.segments
Holds the mxShape that represents the cell graphically.
mxCellState.prototype.shape
Holds the mxText that represents the label of the cell.
mxCellState.prototype.text
Holds the unscaled width of the state.
mxCellState.prototype.unscaledWidth
Returns the mxRectangle that should be used as the perimeter of the cell.
mxCellState.prototype.getPerimeterBounds = function( border, bounds )
Sets the first or last point in absolutePoints depending on isSource.
mxCellState.prototype.setAbsoluteTerminalPoint = function( point, isSource )
Sets the given cursor on the shape and text shape.
mxCellState.prototype.setCursor = function( cursor )
Returns the visible source or target terminal cell.
mxCellState.prototype.getVisibleTerminal = function( source )
Returns the visible source or target terminal state.
mxCellState.prototype.getVisibleTerminalState = function( source )
Sets the visible source or target terminal state.
mxCellState.prototype.setVisibleTerminalState = function( terminalState, source )
Returns the unscaled, untranslated bounds.
mxCellState.prototype.getCellBounds = function()
Returns the unscaled, untranslated paint bounds.
mxCellState.prototype.getPaintBounds = function()
Updates the cellBounds and paintBounds.
mxCellState.prototype.updateCachedBounds = function()
Copies all fields from the given state to this state.
mxCellState.prototype.setState = function( state )
Returns a clone of this mxPoint.
mxCellState.prototype.clone = function()
Destroys the state and all associated resources.
mxCellState.prototype.destroy = function()
Inner callback to add the specified mxCell to the selection.
mxGraphSelectionModel.prototype.changeSelection = function( added, removed )
Constructs a new graph selection model for the given mxGraph.
function mxGraphSelectionModel( graph )
Specifies the resource key for the status message after a long operation.
mxGraphSelectionModel.prototype.doneResource
Specifies the resource key for the status message while the selection is being updated.
mxGraphSelectionModel.prototype.updatingSelectionResource
Reference to the enclosing mxGraph.
mxGraphSelectionModel.prototype.graph
Specifies if only one selected item at a time is allowed.
mxGraphSelectionModel.prototype.singleSelection
Returns singleSelection as a boolean.
mxGraphSelectionModel.prototype.isSingleSelection = function()
Sets the singleSelection flag.
mxGraphSelectionModel.prototype.setSingleSelection = function( singleSelection )
Returns true if the given mxCell is selected.
mxGraphSelectionModel.prototype.isSelected = function( cell )
Returns true if no cells are currently selected.
mxGraphSelectionModel.prototype.isEmpty = function()
Clears the selection and fires a change event if the selection was not empty.
mxGraphSelectionModel.prototype.clear = function()
Selects the specified mxCell using setCells.
mxGraphSelectionModel.prototype.setCell = function( cell )
Selects the given array of mxCells and fires a change event.
mxGraphSelectionModel.prototype.setCells = function( cells )
Returns the first selectable cell in the given array of cells.
mxGraphSelectionModel.prototype.getFirstSelectableCell = function( cells )
Adds the given mxCell to the selection and fires a select event.
mxGraphSelectionModel.prototype.addCell = function( cell )
Adds the given array of mxCells to the selection and fires a select event.
mxGraphSelectionModel.prototype.addCells = function( cells )
Removes the specified mxCell from the selection and fires a select event for the remaining cells.
mxGraphSelectionModel.prototype.removeCell = function( cell )
mxGraphSelectionModel.prototype.removeCells = function( cells )
Inner callback to add the specified mxCell to the selection.
mxGraphSelectionModel.prototype.cellAdded = function( cell )
Inner callback to remove the specified mxCell from the selection.
mxGraphSelectionModel.prototype.cellRemoved = function( cell )
Changes the current root of the view.
mxSelectionChange.prototype.execute = function()
Constructs a new in-place editor for the specified graph.
function mxCellEditor( graph )
Reference to the enclosing mxGraph.
mxCellEditor.prototype.graph
Holds the DIV that is used for text editing.
mxCellEditor.prototype.textarea
Reference to the mxCell that is currently being edited.
mxCellEditor.prototype.editingCell
Reference to the event that was used to start editing.
mxCellEditor.prototype.trigger
Specifies if the label has been modified.
mxCellEditor.prototype.modified
Specifies if the textarea should be resized while the text is being edited.
mxCellEditor.prototype.autoSize
Specifies if the text should be selected when editing starts.
mxCellEditor.prototype.selectText
Text to be displayed for empty labels.
mxCellEditor.prototype.emptyLabelText
If true, pressing the escape key will stop editing and not accept the new value.
mxCellEditor.prototype.escapeCancelsEditing
Reference to the label DOM node that has been hidden.
mxCellEditor.prototype.textNode
Specifies the zIndex for the textarea.
mxCellEditor.prototype.zIndex
Defines the minimum width and height to be used in resize.
mxCellEditor.prototype.minResize
Returns modified.
mxCellEditor.prototype.resize = function()
Correction factor for word wrapping width.
mxCellEditor.prototype.wordWrapPadding
If focusLost should be called if textarea loses the focus.
mxCellEditor.prototype.blurEnabled
Called if the textarea has lost focus.
mxCellEditor.prototype.focusLost = function()
Holds the initial editing value to check if the current value was modified.
mxCellEditor.prototype.initialValue
Holds the current temporary horizontal alignment for the cell style.
mxCellEditor.prototype.align
Creates the textarea and installs the event listeners.
mxCellEditor.prototype.init = function ()
Called in stopEditing if cancel is false to invoke mxGraph.labelChanged.
mxCellEditor.prototype.applyValue = function( state, value )
Stops the editor and applies the value if cancel is false.
mxCellEditor.prototype.stopEditing = function( cancel )
Sets the label of the specified cell to the given value using cellLabelChanged and fires mxEvent.LABEL_CHANGED while the transaction is in progress.
mxGraph.prototype.labelChanged = function( cell, value, evt )
Sets the temporary horizontal alignment for the current editing session.
mxCellEditor.prototype.setAlign = function ( align )
Gets the initial editing value for the given cell.
mxCellEditor.prototype.getInitialValue = function( state, trigger )
Returns the current editing value.
mxCellEditor.prototype.getCurrentValue = function( state )
Returns true if escapeCancelsEditing is true and shift, control and meta are not pressed.
mxCellEditor.prototype.isCancelEditingKeyEvent = function( evt )
Installs listeners for focus, change and standard key event handling.
mxCellEditor.prototype.installListeners = function( elt )
Returns true if the given keydown event should stop cell editing.
mxCellEditor.prototype.isStopEditingEvent = function( evt )
Returns true if this editor is the source for the given native event.
mxCellEditor.prototype.isEventSource = function( evt )
Returns the background color for the in-place editor.
mxCellEditor.prototype.getBackgroundColor = function( state )
Returns true if max-width is not supported or if the SVG root element in in the graph does not have CSS position absolute.
mxCellEditor.prototype.isLegacyEditor = function()
Starts the editor for the given cell.
mxCellEditor.prototype.startEditing = function( cell, trigger )
Returns selectText.
mxCellEditor.prototype.isSelectText = function()
Prepares the textarea for getting its value in stopEditing.
mxCellEditor.prototype.prepareTextarea = function()
Returns true if the label should be hidden while the cell is being edited.
mxCellEditor.prototype.isHideLabel = function( state )
Returns the minimum width and height for editing the given state.
mxCellEditor.prototype.getMinimumSize = function( state )
Returns the mxRectangle that defines the bounds of the editor.
mxCellEditor.prototype.getEditorBounds = function( state )
Returns the initial label value to be used of the label of the given cell is empty.
mxCellEditor.prototype.getEmptyLabelText = function ( cell )
Returns the cell that is currently being edited or null if no cell is being edited.
mxCellEditor.prototype.getEditingCell = function ()
Destroys the editor and removes all associated resources.
mxCellEditor.prototype.destroy = function ()
arrow, rectangle, ellipse, rhombus, image, line, label, cylinder, swimlane, connector, actor and cloud.
function mxCellRenderer()
Static array that contains the globally registered shapes which are known to all instances of this class.
mxCellRenderer.defaultShapes
Defines the default shape for edges.
mxCellRenderer.prototype.defaultEdgeShape
Defines the default shape for vertices.
mxCellRenderer.prototype.defaultVertexShape
Defines the default shape for labels.
mxCellRenderer.prototype.defaultTextShape
Specifies if the folding icon should ignore the horizontal orientation of a swimlane.
mxCellRenderer.prototype.legacyControlPosition
Specifies if spacing and label position should be ignored if overflow is fill or width.
mxCellRenderer.prototype.legacySpacing
Anti-aliasing option for new shapes.
mxCellRenderer.prototype.antiAlias
Minimum stroke width for SVG output.
mxCellRenderer.prototype.minSvgStrokeWidth
Specifies if the enabled state of the graph should be ignored in the control click handler (to allow folding in disabled graphs).
mxCellRenderer.prototype.forceControlClickHandler
Registers the given constructor under the specified key in this instance of the renderer.
mxCellRenderer.registerShape = function( key, shape )
Initializes the shape in the given state by calling its init method with the correct container after configuring it using configureShape.
mxCellRenderer.prototype.initializeShape = function( state )
Configures the shape for the given cell state.
mxCellRenderer.prototype.configureShape = function( state )
Creates and returns the shape for the given cell state.
mxCellRenderer.prototype.createShape = function( state )
Creates the indicator shape for the given cell state.
mxCellRenderer.prototype.createIndicatorShape = function( state )
Returns the shape for the given name from defaultShapes.
mxCellRenderer.prototype.getShape = function( name )
Returns the constructor to be used for creating the shape.
mxCellRenderer.prototype.getShapeConstructor = function( state )
Replaces any reserved words used for attributes, eg.
mxCellRenderer.prototype.postConfigureShape = function( state )
Resolves special keywords ‘inherit’, ‘indicated’ and ‘swimlane’ and sets the respective color on the shape.
mxCellRenderer.prototype.checkPlaceholderStyles = function( state )
Resolves special keywords ‘inherit’, ‘indicated’ and ‘swimlane’ and sets the respective color on the shape.
mxCellRenderer.prototype.resolveColor = function( state, field, key )
Returns the value to be used for the label.
mxCellRenderer.prototype.getLabelValue = function( state )
Creates the label for the given cell state.
mxCellRenderer.prototype.createLabel = function( state, value )
Initiailzes the label with a suitable container.
mxCellRenderer.prototype.initializeLabel = function( state, shape )
Creates the actual shape for showing the overlay for the given cell state.
mxCellRenderer.prototype.createCellOverlays = function( state )
Initializes the given overlay.
mxCellRenderer.prototype.initializeOverlay = function( state, overlay )
Creates the control for the given cell state.
mxCellRenderer.prototype.createControl = function( state )
Hook for creating the click handler for the folding icon.
mxCellRenderer.prototype.createControlClickHandler = function( state )
Initializes the given control and returns the corresponding DOM node.
mxCellRenderer.prototype.initControl = function( state, control, handleEvents, clickHandler )
Returns true if the event is for the shape of the given state.
mxCellRenderer.prototype.isShapeEvent = function( state, evt )
Returns true if the event is for the label of the given state.
mxCellRenderer.prototype.isLabelEvent = function( state, evt )
Installs the event listeners for the given cell state.
mxCellRenderer.prototype.installListeners = function( state )
Redraws the label for the given cell state.
mxCellRenderer.prototype.redrawLabel = function( state, forced )
Returns true if the style for the text shape has changed.
mxCellRenderer.prototype.isTextShapeInvalid = function( state, shape )
Called to invoked redraw on the given text shape.
mxCellRenderer.prototype.redrawLabelShape = function( shape )
Returns the scaling used for the label of the given state
mxCellRenderer.prototype.getTextScale = function( state )
Returns the bounds to be used to draw the label of the given state.
mxCellRenderer.prototype.getLabelBounds = function( state )
Adds the shape rotation to the given label bounds and applies the alignment and offsets.
mxCellRenderer.prototype.rotateLabelBounds = function( state, bounds )
Redraws the overlays for the given cell state.
mxCellRenderer.prototype.redrawCellOverlays = function( state, forced )
Redraws the control for the given cell state.
mxCellRenderer.prototype.redrawControl = function( state, forced )
Returns the bounds to be used to draw the control (folding icon) of the given state.
mxCellRenderer.prototype.getControlBounds = function( state, w, h )
Inserts the given array of mxShapes after the given nodes in the DOM.
mxCellRenderer.prototype.insertStateAfter = function( state, node, htmlNode )
Returns the mxShapes for the given cell state in the order in which they should appear in the DOM.
mxCellRenderer.prototype.getShapesForState = function( state )
Updates the bounds or points and scale of the shapes for the given cell state.
mxCellRenderer.prototype.redraw = function( state, force, rendering )
Redraws the shape for the given cell state.
mxCellRenderer.prototype.redrawShape = function( state, force, rendering )
Invokes redraw on the shape of the given state.
mxCellRenderer.prototype.doRedrawShape = function( state )
Returns true if the given shape must be repainted.
mxCellRenderer.prototype.isShapeInvalid = function( state, shape )
Destroys the shapes associated with the given cell state.
mxCellRenderer.prototype.destroy = function( state )
Implements an entity relation style for edges (as used in database schema diagrams).
EntityRelation: function ( state, source, target, points, result )
Implements a self-reference, aka.
Loop: function ( state, source, target, points, result )
Uses either SideToSide or TopToBottom depending on the horizontal flag in the cell style.
ElbowConnector: function ( state, source, target, points, result )
Implements a vertical elbow edge.
SideToSide: function ( state, source, target, points, result )
Implements a horizontal elbow edge.
TopToBottom: function( state, source, target, points, result )
Implements an orthogonal edge style.
SegmentConnector: function( state, source, target, hints, result )
Puts the given object into the registry under the given name.
putValue: function( name, obj )
Returns the value associated with the given name.
getValue: function( name )
Returns the name for the given value.
getName: function( value )
Sets and returns the current root and fires an undo event before calling mxGraph.sizeDidChange.
mxGraphView.prototype.setCurrentRoot = function( root )
Sets the scale and translation and fires a scale and translate event before calling revalidate followed by mxGraph.sizeDidChange.
mxGraphView.prototype.scaleAndTranslate = function( scale, dx, dy )
Sets the scale and fires a scale event before calling revalidate followed by mxGraph.sizeDidChange.
mxGraphView.prototype.setScale = function( value )
Sets the translation and fires a translate event before calling revalidate followed by mxGraph.sizeDidChange.
mxGraphView.prototype.setTranslate = function( dx, dy )
Constructs a new view for the given mxGraph.
function mxGraphView( graph )
Specifies the resource key for the status message after a long operation.
mxGraphView.prototype.doneResource
Specifies if string values in cell styles should be evaluated using mxUtils.eval.
mxGraphView.prototype.allowEval
Specifies if a gesture should be captured when it goes outside of the graph container.
mxGraphView.prototype.captureDocumentGesture
Specifies if the canvas should be hidden while rendering in IE8 standards mode and quirks mode.
mxGraphView.prototype.optimizeVmlReflows
Specifies if shapes should be created, updated and destroyed using the methods of mxCellRenderer in graph.
mxGraphView.prototype.rendering
Reference to the enclosing mxGraph.
mxGraphView.prototype.graph
mxCell that acts as the root of the displayed cell hierarchy.
mxGraphView.prototype.currentRoot
mxRectangle that caches the scales, translated bounds of the current view.
mxGraphView.prototype.graphBounds
Specifies the scale.
mxGraphView.prototype.scale
mxPoint that specifies the current translation.
mxGraphView.prototype.translate
mxDictionary that maps from cell IDs to mxCellStates.
mxGraphView.prototype.states
Specifies if the style should be updated in each validation step.
mxGraphView.prototype.updateStyle
During validation, this contains the last DOM node that was processed.
mxGraphView.prototype.lastNode
During validation, this contains the last HTML DOM node that was processed.
mxGraphView.prototype.lastHtmlNode
During validation, this contains the last edge’s DOM node that was processed.
mxGraphView.prototype.lastForegroundNode
During validation, this contains the last edge HTML DOM node that was processed.
mxGraphView.prototype.lastForegroundHtmlNode
Returns graphBounds.
mxGraphView.prototype.getGraphBounds = function()
Sets graphBounds.
mxGraphView.prototype.setGraphBounds = function( value )
Returns the union of all mxCellStates for the given array of mxCells.
mxGraphView.prototype.getBounds = function( cells )
Called when the size of the graph has changed.
mxGraph.prototype.sizeDidChange = function()
Revalidates the complete view with all cell states.
mxGraphView.prototype.revalidate = function()
Returns the scale.
mxGraphView.prototype.getScale = function()
Returns the translate.
mxGraphView.prototype.getTranslate = function()
Invoked after scale and/or translate has changed.
mxGraphView.prototype.viewStateChanged = function()
Clears the view if currentRoot is not null and revalidates.
mxGraphView.prototype.refresh = function()
Removes the state of the given cell and all descendants if the given cell is not the current root.
mxGraphView.prototype.clear = function( cell, force, recurse )
Invalidates the state of the given cell, all its descendants and connected edges.
mxGraphView.prototype.invalidate = function( cell, recurse, includeEdges )
Calls validateCell and validateCellState and updates the graphBounds using getBoundingBox.
mxGraphView.prototype.validate = function( cell )
Recursively creates the cell state for the given cell if visible is true and the given cell is visible.
mxGraphView.prototype.validateCell = function( cell, visible )
Validates and repaints the mxCellState for the given mxCell.
mxGraphView.prototype.validateCellState = function( cell, recurse )
Returns the bounding box of the shape and the label for the given mxCellState and its children if recurse is true.
mxGraphView.prototype.getBoundingBox = function( state, recurse )
Returns the bounds for an empty graph.
mxGraphView.prototype.getEmptyBounds = function()
Creates and returns the shape used as the background page.
mxGraphView.prototype.createBackgroundPageShape = function( bounds )
Calls validateBackgroundImage and validateBackgroundPage.
mxGraphView.prototype.validateBackground = function()
Validates the background image.
mxGraphView.prototype.validateBackgroundImage = function()
Validates the background page.
mxGraphView.prototype.validateBackgroundPage = function()
Returns the bounds for the background page.
mxGraphView.prototype.getBackgroundPageBounds = function()
Updates the bounds and redraws the background image.
mxGraphView.prototype.redrawBackgroundImage = function( backgroundImage, bg )
Updates the given mxCellState.
mxGraphView.prototype.updateCellState = function( state )
Returns true if the children of the given cell should not be visible in the view.
mxGraphView.prototype.isCellCollapsed = function( cell )
Validates the given cell state.
mxGraphView.prototype.updateVertexState = function( state, geo )
Validates the given cell state.
mxGraphView.prototype.updateEdgeState = function( state, geo )
Updates the absoluteOffset of the given vertex cell state.
mxGraphView.prototype.updateVertexLabelOffset = function( state )
Resets the current validation state.
mxGraphView.prototype.resetValidationState = function()
Invoked when a state has been processed in validatePoints.
mxGraphView.prototype.stateValidated = function( state )
Sets the initial absolute terminal points in the given state before the edge style is computed.
mxGraphView.prototype.updateFixedTerminalPoints = function( edge, source, target )
Sets the fixed source or target terminal point on the given edge.
mxGraphView.prototype.updateFixedTerminalPoint = function( edge, terminal, source, constraint )
Returns the fixed source or target terminal point for the given edge.
mxGraphView.prototype.getFixedTerminalPoint = function( edge, terminal, source, constraint )
Updates the bounds of the given cell state to reflect the bounds of the stencil if it has a fixed aspect and returns the previous bounds as an mxRectangle if the bounds have been modified or null otherwise.
mxGraphView.prototype.updateBoundsFromStencil = function( state )
Updates the absolute points in the given state using the specified array of mxPoints as the relative points.
mxGraphView.prototype.updatePoints = function( edge, points, source, target )
Transforms the given control point to an absolute point.
mxGraphView.prototype.transformControlPoint = function( state, pt )
Returns true if the given edge should be routed with mxGraph.defaultLoopStyle or the mxConstants.STYLE_LOOP defined for the given edge.
mxGraphView.prototype.isLoopStyleEnabled = function( edge, points, source, target )
mxEdgeStyle to be used for loops.
mxGraph.prototype.defaultLoopStyle
Returns the edge style function to be used to render the given edge state.
mxGraphView.prototype.getEdgeStyle = function( edge, points, source, target )
Updates the terminal points in the given state after the edge style was computed for the edge.
mxGraphView.prototype.updateFloatingTerminalPoints = function( state, source, target )
Updates the absolute terminal point in the given state for the given start and end state, where start is the source if source is true.
mxGraphView.prototype.updateFloatingTerminalPoint = function( edge, start, end, source )
Returns the floating terminal point for the given edge, start and end state, where start is the source if source is true.
mxGraphView.prototype.getFloatingTerminalPoint = function( edge, start, end, source )
Returns an mxCellState that represents the source or target terminal or port for the given edge.
mxGraphView.prototype.getTerminalPort = function( state, terminal, source )
Returns an mxPoint that defines the location of the intersection point between the perimeter and the line between the center of the shape and the given point.
mxGraphView.prototype.getPerimeterPoint = function( terminal, next, orthogonal, border )
Returns the x-coordinate of the center point for automatic routing.
mxGraphView.prototype.getRoutingCenterX = function ( state )
Returns the y-coordinate of the center point for automatic routing.
mxGraphView.prototype.getRoutingCenterY = function ( state )
Returns the perimeter bounds for the given terminal, edge pair as an mxRectangle.
mxGraphView.prototype.getPerimeterBounds = function( terminal, border )
Returns the perimeter function for the given state.
mxGraphView.prototype.getPerimeterFunction = function( state )
Returns the nearest point in the list of absolute points or the center of the opposite terminal.
mxGraphView.prototype.getNextPoint = function( edge, opposite, source )
Returns the nearest ancestor terminal that is visible.
mxGraphView.prototype.getVisibleTerminal = function( edge, source )
Updates the given state using the bounding box of t he absolute points.
mxGraphView.prototype.updateEdgeBounds = function( state )
Returns the absolute point on the edge for the given relative mxGeometry as an mxPoint.
mxGraphView.prototype.getPoint = function( state, geometry )
Gets the relative point that describes the given, absolute label position for the given edge state.
mxGraphView.prototype.getRelativePoint = function( edgeState, x, y )
Updates mxCellState.absoluteOffset for the given state.
mxGraphView.prototype.updateEdgeLabelOffset = function( state )
Returns the mxCellState for the given cell.
mxGraphView.prototype.getState = function( cell, create )
Returns rendering.
mxGraphView.prototype.isRendering = function()
Sets rendering.
mxGraphView.prototype.setRendering = function( value )
Returns allowEval.
mxGraphView.prototype.isAllowEval = function()
Sets allowEval.
mxGraphView.prototype.setAllowEval = function( value )
Returns states.
mxGraphView.prototype.getStates = function()
Sets states.
mxGraphView.prototype.setStates = function( value )
Returns the mxCellStates for the given array of mxCells.
mxGraphView.prototype.getCellStates = function( cells )
Removes and returns the mxCellState for the given cell.
mxGraphView.prototype.removeState = function( cell )
Creates and returns an mxCellState for the given cell and initializes it using mxCellRenderer.initialize.
mxGraphView.prototype.createState = function( cell )
Returns the DOM node that contains the background-, draw- and overlay- and decoratorpanes.
mxGraphView.prototype.getCanvas = function()
Returns the DOM node that represents the background layer.
mxGraphView.prototype.getBackgroundPane = function()
Returns the DOM node that represents the main drawing layer.
mxGraphView.prototype.getDrawPane = function()
Returns the DOM node that represents the layer above the drawing layer.
mxGraphView.prototype.getOverlayPane = function()
Returns the DOM node that represents the topmost drawing layer.
mxGraphView.prototype.getDecoratorPane = function()
Returns true if the event origin is one of the drawing panes or containers of the view.
mxGraphView.prototype.isContainerEvent = function( evt )
Returns true if the event origin is one of the scrollbars of the container in IE.
mxGraphView.prototype.isScrollEvent = function( evt )
Initializes the graph event dispatch loop for the specified container and invokes create to create the required DOM nodes for the display.
mxGraphView.prototype.init = function()
Creates the DOM nodes for the HTML display.
mxGraphView.prototype.createHtml = function()
Installs the required listeners in the container.
mxGraphView.prototype.installListeners = function()
Updates the size of the HTML canvas.
mxGraphView.prototype.updateHtmlCanvasSize = function( width, height )
Creates and returns a drawing pane in HTML (DIV).
mxGraphView.prototype.createHtmlPane = function( width, height )
Creates a drawing pane in VML (group).
mxGraphView.prototype.createVmlPane = function( width, height )
Updates the style of the container after installing the SVG DOM elements.
mxGraphView.prototype.updateContainerStyle = function( container )
Destroys the view and all its resources.
mxGraphView.prototype.destroy = function()
Constructs a change of the current root in the given view.
function mxCurrentRootChange( view, root )
Changes the current root of the view.
mxCurrentRootChange.prototype.execute = function()
Aligns the given cells vertically or horizontally according to the given alignment using the optional parameter as the coordinate.
mxGraph.prototype.alignCells = function( align, cells, param )
Toggles the style of the given edge between null (or empty) and alternateEdgeStyle.
mxGraph.prototype.flipEdge = function( edge )
Moves the given cells to the front or back.
mxGraph.prototype.orderCells = function( back, cells )
Moves the given cells to the front or back.
mxGraph.prototype.cellsOrdered = function( cells, back )
Adds the cells into the given group.
mxGraph.prototype.groupCells = function( group, border, cells )
Ungroups the given cells by moving the children the children to their parents parent and removing the empty groups.
mxGraph.prototype.ungroupCells = function( cells )
Removes the specified cells from their parents and adds them to the default parent.
mxGraph.prototype.removeCellsFromParent = function( cells )
Adds the cells to the parent at the given index, connecting each cell to the optional source and target terminal.
mxGraph.prototype.addCells = function( cells, parent, index, source, target )
Adds the specified cells to the given parent.
mxGraph.prototype.cellsAdded = function( cells, parent, index, source, target, absolute, constrain, extend )
Removes the given cells from the graph including all connected edges if includeEdges is true.
mxGraph.prototype.removeCells = function( cells, includeEdges )
Removes the given cells from the model.
mxGraph.prototype.cellsRemoved = function( cells )
Splits the given edge by adding the newEdge between the previous source and the given cell and reconnecting the source of the given edge to the given cell.
mxGraph.prototype.splitEdge = function( edge, cells, newEdge, dx, dy )
Sets the visible state of the specified cells and all connected edges if includeEdges is true.
mxGraph.prototype.toggleCells = function( show, cells, includeEdges )
Sets the collapsed state of the specified cells and all descendants if recurse is true.
mxGraph.prototype.foldCells = function( collapse, recurse, cells, checkFoldable, evt )
Updates the size of the given cell in the model using cellSizeUpdated.
mxGraph.prototype.updateCellSize = function( cell, ignoreChildren )
Sets the bounds of the given cells and fires a mxEvent.RESIZE_CELLS event while the transaction is in progress.
mxGraph.prototype.resizeCells = function( cells, bounds, recurse )
Sets the bounds of the given cells and fires a mxEvent.CELLS_RESIZED event.
mxGraph.prototype.cellsResized = function( cells, bounds, recurse )
Moves or clones the specified cells and moves the cells or clones by the given amount, adding them to the optional target cell.
mxGraph.prototype.moveCells = function( cells, dx, dy, clone, target, evt, mapping )
Moves the specified cells by the given vector, disconnecting the cells using disconnectGraph is disconnect is true.
mxGraph.prototype.cellsMoved = function( cells, dx, dy, disconnect, constrain, extend )
Connects the specified end of the given edge to the given terminal using cellConnected and fires mxEvent.CONNECT_CELL while the transaction is in progress.
mxGraph.prototype.connectCell = function( edge, terminal, source, constraint )
Sets the new terminal for the given edge and resets the edge points if resetEdgesOnConnect is true.
mxGraph.prototype.cellConnected = function( edge, terminal, source, constraint )
Clears all cell states or the states for the hierarchy starting at the given cell and validates the graph.
mxGraph.prototype.refresh = function( cell )
Processes a singleclick on an optional cell and fires a click event.
mxGraph.prototype.click = function( me )
Processes a doubleclick on an optional cell and fires a dblclick event.
mxGraph.prototype.dblClick = function( evt, cell )
Dispatches a mxEvent.GESTURE event.
mxGraph.prototype.fireGestureEvent = function( evt, cell )
Handles the mxMouseEvent by highlighting the mxCellState.
mxGraph.prototype.tapAndHold = function( me )
Dispatches the given event in the graph event dispatch loop.
mxGraph.prototype.fireMouseEvent = function( evtName, me, sender )
Fires a startEditing event and invokes mxCellEditor.startEditing on editor.
mxGraph.prototype.startEditingAtCell = function( cell, evt )
Stops the current editing and fires a editingStopped event.
mxGraph.prototype.stopEditing = function( cancel )
Sets the new label for a cell.
mxGraph.prototype.cellLabelChanged = function( cell, value, autoSize )
Adds an mxCellOverlay for the specified cell.
mxGraph.prototype.addCellOverlay = function( cell, overlay )
Removes and returns the given mxCellOverlay from the given cell.
mxGraph.prototype.removeCellOverlay = function( cell, overlay )
Removes all mxCellOverlays from the given cell.
mxGraph.prototype.removeCellOverlays = function( cell )
Constructs a new mxGraph in the specified container.
function mxGraph( container, model, renderHint, stylesheet )
Holds the mouse event listeners.
mxGraph.prototype.mouseListeners
Holds the state of the mouse button.
mxGraph.prototype.isMouseDown
Holds the mxGraphModel that contains the cells to be displayed.
mxGraph.prototype.model
Holds the mxGraphView that caches the mxCellStates for the cells.
mxGraph.prototype.view
Holds the mxStylesheet that defines the appearance of the cells.
mxGraph.prototype.stylesheet
Holds the mxGraphSelectionModel that models the current selection.
mxGraph.prototype.selectionModel
Holds the mxCellEditor that is used as the in-place editing.
mxGraph.prototype.cellEditor
Holds the mxCellRenderer for rendering the cells in the graph.
mxGraph.prototype.cellRenderer
An array of mxMultiplicities describing the allowed connections in a graph.
mxGraph.prototype.multiplicities
RenderHint as it was passed to the constructor.
mxGraph.prototype.renderHint
Dialect to be used for drawing the graph.
mxGraph.prototype.dialect
Specifies the grid size.
mxGraph.prototype.gridSize
Specifies if the grid is enabled.
mxGraph.prototype.gridEnabled
Specifies if ports are enabled.
mxGraph.prototype.portsEnabled
Specifies if double taps on touch-based devices should be handled as a double click.
mxGraph.prototype.doubleTapEnabled
Specifies the timeout for double taps and non-native double clicks.
mxGraph.prototype.doubleTapTimeout
Specifies the tolerance for double taps and double clicks in quirks mode.
mxGraph.prototype.doubleTapTolerance
Holds the time of the last touch event for double click detection.
mxGraph.prototype.lastTouchTime
Specifies if tap and hold should be used for starting connections on touch-based devices.
mxGraph.prototype.tapAndHoldEnabled
Specifies the time for a tap and hold.
mxGraph.prototype.tapAndHoldDelay
True if the timer for tap and hold events is running.
mxGraph.prototype.tapAndHoldInProgress
True as long as the timer is running and the touch events stay within the given tapAndHoldTolerance.
mxGraph.prototype.tapAndHoldValid
Holds the x-coordinate of the intial touch event for tap and hold.
mxGraph.prototype.initialTouchX
Holds the y-coordinate of the intial touch event for tap and hold.
mxGraph.prototype.initialTouchY
Tolerance for a move to be handled as a single click.
mxGraph.prototype.tolerance
Value returned by getOverlap if isAllowOverlapParent returns true for the given cell.
mxGraph.prototype.defaultOverlap
Returns a decimal number representing the amount of the width and height of the given cell that is allowed to overlap its parent.
mxGraph.prototype.getOverlap = function( cell )
Returns true if the given cell is allowed to be placed outside of the parents area.
mxGraph.prototype.isAllowOverlapParent = function( cell )
Specifies the default parent to be used to insert new cells.
mxGraph.prototype.defaultParent
Specifies the alternate edge style to be used if the main control point on an edge is being doubleclicked.
mxGraph.prototype.alternateEdgeStyle
Specifies the mxImage to be returned by getBackgroundImage.
mxGraph.prototype.backgroundImage
Returns the backgroundImage as an mxImage.
mxGraph.prototype.getBackgroundImage = function()
Specifies if the background page should be visible.
mxGraph.prototype.pageVisible
Specifies if a dashed line should be drawn between multiple pages.
mxGraph.prototype.pageBreaksVisible
Specifies the color for page breaks.
mxGraph.prototype.pageBreakColor
Specifies the page breaks should be dashed.
mxGraph.prototype.pageBreakDashed
Specifies the minimum distance for page breaks to be visible.
mxGraph.prototype.minPageBreakDist
Specifies if the graph size should be rounded to the next page number in sizeDidChange.
mxGraph.prototype.preferPageSize
Specifies the page format for the background page.
mxGraph.prototype.pageFormat
Specifies the scale of the background page.
mxGraph.prototype.pageScale
Specifies the return value for isEnabled.
mxGraph.prototype.enabled
Returns true if the graph is enabled.
mxGraph.prototype.isEnabled = function()
Specifies if mxKeyHandler should invoke escape when the escape key is pressed.
mxGraph.prototype.escapeEnabled
Processes an escape keystroke.
mxGraph.prototype.escape = function( evt )
If true, when editing is to be stopped by way of selection changing, data in diagram changing or other means stopCellEditing is invoked, and changes are saved.
mxGraph.prototype.invokesStopCellEditing
If true, pressing the enter key without pressing control or shift will stop editing and accept the new value.
mxGraph.prototype.enterStopsCellEditing
Specifies if scrollbars should be used for panning in panGraph if any scrollbars are available.
mxGraph.prototype.useScrollbarsForPanning
Shifts the graph display by the given amount.
mxGraph.prototype.panGraph = function( dx, dy )
Specifies the return value for canExportCell.
mxGraph.prototype.exportEnabled
Returns true if the given cell may be exported to the clipboard.
mxGraph.prototype.canExportCell = function( cell )
Specifies the return value for canImportCell.
mxGraph.prototype.importEnabled
Returns true if the given cell may be imported from the clipboard.
mxGraph.prototype.canImportCell = function( cell )
Specifies the return value for isCellLocked.
mxGraph.prototype.cellsLocked
Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected.
mxGraph.prototype.isCellLocked = function( cell )
Specifies the return value for isCellCloneable.
mxGraph.prototype.cellsCloneable
Returns true if the given cell is cloneable.
mxGraph.prototype.isCellCloneable = function( cell )
Specifies if folding (collapse and expand via an image icon in the graph should be enabled).
mxGraph.prototype.foldingEnabled
Specifies the return value for isCellEditable.
mxGraph.prototype.cellsEditable
Returns true if the given cell is editable.
mxGraph.prototype.isCellEditable = function( cell )
Specifies the return value for isCellDeletable.
mxGraph.prototype.cellsDeletable
Returns true if the given cell is moveable.
mxGraph.prototype.isCellDeletable = function( cell )
Specifies the return value for isCellMovable.
mxGraph.prototype.cellsMovable
Returns true if the given cell is moveable.
mxGraph.prototype.isCellMovable = function( cell )
Specifies the return value for edges in isLabelMovable.
mxGraph.prototype.edgeLabelsMovable
Returns true if the given edges’s label is moveable.
mxGraph.prototype.isLabelMovable = function( cell )
Specifies the return value for vertices in isLabelMovable.
mxGraph.prototype.vertexLabelsMovable
Specifies the return value for isDropEnabled.
mxGraph.prototype.dropEnabled
Returns dropEnabled as a boolean.
mxGraph.prototype.isDropEnabled = function()
Specifies if dropping onto edges should be enabled.
mxGraph.prototype.splitEnabled
Specifies the return value for isCellResizable.
mxGraph.prototype.cellsResizable
Returns true if the given cell is resizable.
mxGraph.prototype.isCellResizable = function( cell )
Specifies the return value for isCellsBendable.
mxGraph.prototype.cellsBendable
Returns cellsBenadable.
mxGraph.prototype.isCellsBendable = function()
Specifies the return value for isCellSelectable.
mxGraph.prototype.cellsSelectable
Returns true if the given cell is selectable.
mxGraph.prototype.isCellSelectable = function( cell )
Specifies the return value for isCellDisconntable.
mxGraph.prototype.cellsDisconnectable
Specifies if the graph should automatically update the cell size after an edit.
mxGraph.prototype.autoSizeCells
Specifies if autoSize style should be applied when cells are added.
mxGraph.prototype.autoSizeCellsOnAdd
Specifies if the graph should automatically scroll if the mouse goes near the container edge while dragging.
mxGraph.prototype.autoScroll
Specifies if the graph should automatically scroll regardless of the scrollbars.
mxGraph.prototype.ignoreScrollbars
Specifies if the graph should automatically convert the current scroll position to a translate in the graph view when a mouseUp event is received.
mxGraph.prototype.translateToScrollPosition
Specifies if autoscrolling should be carried out via mxPanningManager even if the container has scrollbars.
mxGraph.prototype.timerAutoScroll
Specifies if panning via panGraph should be allowed to implement autoscroll if no scrollbars are available in scrollPointToVisible.
mxGraph.prototype.allowAutoPanning
Scrolls the graph to the given point, extending the graph container if specified.
mxGraph.prototype.scrollPointToVisible = function( x, y, extend, border )
Specifies if the size of the graph should be automatically extended if the mouse goes near the container edge while dragging.
mxGraph.prototype.autoExtend
mxRectangle that specifies the area in which all cells in the diagram should be placed.
mxGraph.prototype.maximumGraphBounds
mxRectangle that specifies the minimum size of the graph.
mxGraph.prototype.minimumGraphSize
mxRectangle that specifies the minimum size of the container if resizeContainer is true.
mxGraph.prototype.minimumContainerSize
Specifies if the container should be resized to the graph size when the graph size has changed.
mxGraph.prototype.resizeContainer
mxRectangle that specifies the maximum size of the container if resizeContainer is true.
mxGraph.prototype.maximumContainerSize
Border to be added to the bottom and right side when the container is being resized after the graph has been changed.
mxGraph.prototype.border
Specifies if edges should appear in the foreground regardless of their order in the model.
mxGraph.prototype.keepEdgesInForeground
Specifies if edges should appear in the background regardless of their order in the model.
mxGraph.prototype.keepEdgesInBackground
Specifies if negative coordinates for vertices are allowed.
mxGraph.prototype.allowNegativeCoordinates
Specifies if a child should be constrained inside the parent bounds after a move or resize of the child.
mxGraph.prototype.constrainChildren
Specifies if child cells with relative geometries should be constrained inside the parent bounds, if constrainChildren is true, and/or the maximumGraphBounds.
mxGraph.prototype.constrainRelativeChildren
Specifies if a parent should contain the child bounds after a resize of the child.
mxGraph.prototype.extendParents
Specifies if parents should be extended according to the extendParents switch if cells are added.
mxGraph.prototype.extendParentsOnAdd
Specifies the return value for isRecursiveResize.
mxGraph.prototype.recursiveResize
Returns recursiveResize.
mxGraph.prototype.isRecursiveResize = function( state )
Specifies if the cell size should be changed to the preferred size when a cell is first collapsed.
mxGraph.prototype.collapseToPreferredSize
Specifies the factor used for zoomIn and zoomOut.
mxGraph.prototype.zoomFactor
Zooms into the graph by zoomFactor.
mxGraph.prototype.zoomIn = function()
Zooms out of the graph by zoomFactor.
mxGraph.prototype.zoomOut = function()
Specifies if the viewport should automatically contain the selection cells after a zoom operation.
mxGraph.prototype.keepSelectionVisibleOnZoom
Specifies if the zoom operations should go into the center of the actual diagram rather than going from top, left.
mxGraph.prototype.centerZoom
Specifies if the scale and translate should be reset if the root changes in the model.
mxGraph.prototype.resetViewOnRootChange
Specifies if edge control points should be reset after the resize of a connected cell.
mxGraph.prototype.resetEdgesOnResize
Specifies if edge control points should be reset after the move of a connected cell.
mxGraph.prototype.resetEdgesOnMove
Specifies if edge control points should be reset after the the edge has been reconnected.
mxGraph.prototype.resetEdgesOnConnect
Specifies if loops (aka self-references) are allowed.
mxGraph.prototype.allowLoops
Specifies if multiple edges in the same direction between the same pair of vertices are allowed.
mxGraph.prototype.multigraph
Specifies if edges are connectable.
mxGraph.prototype.connectableEdges
Specifies if edges with disconnected terminals are allowed in the graph.
mxGraph.prototype.allowDanglingEdges
Specifies if edges that are cloned should be validated and only inserted if they are valid.
mxGraph.prototype.cloneInvalidEdges
Specifies if edges should be disconnected from their terminals when they are moved.
mxGraph.prototype.disconnectOnMove
Specifies if labels should be visible.
mxGraph.prototype.labelsVisible
Specifies the return value for isHtmlLabel.
mxGraph.prototype.htmlLabels
Returns true if the label must be rendered as HTML markup.
mxGraph.prototype.isHtmlLabel = function( cell )
Specifies if swimlanes should be selectable via the content if the mouse is released.
mxGraph.prototype.swimlaneSelectionEnabled
Specifies if nesting of swimlanes is allowed.
mxGraph.prototype.swimlaneNesting
The attribute used to find the color for the indicator if the indicator color is set to ‘swimlane’.
mxGraph.prototype.swimlaneIndicatorColorAttribute
Holds the list of image bundles.
mxGraph.prototype.imageBundles
Specifies the minimum scale to be applied in fit.
mxGraph.prototype.minFitScale
Scales the graph such that the complete diagram fits into container and returns the current scale in the view.
mxGraph.prototype.fit = function( border, keepOrigin, margin, enabled, ignoreWidth, ignoreHeight, maxHeight )
Specifies the maximum scale to be applied in fit.
mxGraph.prototype.maxFitScale
Current horizontal panning value.
mxGraph.prototype.panDx
Current vertical panning value.
mxGraph.prototype.panDy
Specifies the mxImage to indicate a collapsed state.
mxGraph.prototype.collapsedImage
Specifies the mxImage to indicate a expanded state.
mxGraph.prototype.expandedImage
Specifies the mxImage for the image to be used to display a warning overlay.
mxGraph.prototype.warningImage
Specifies the resource key for the error message to be displayed in non-multigraphs when two vertices are already connected.
mxGraph.prototype.alreadyConnectedResource
Specifies the resource key for the warning message to be displayed when a collapsed cell contains validation errors.
mxGraph.prototype.containsValidationErrorsResource
Specifies the resource key for the tooltip on the collapse/expand icon.
mxGraph.prototype.collapseExpandResource
Initializes the container and creates the respective datastructures.
mxGraph.prototype.init = function( container )
Creates the tooltip-, panning-, connection- and graph-handler (in this order).
mxGraph.prototype.createHandlers = function()
Creates and returns a new mxTooltipHandler to be used in this graph.
mxGraph.prototype.createTooltipHandler = function()
Creates and returns a new mxTooltipHandler to be used in this graph.
mxGraph.prototype.createSelectionCellsHandler = function()
Creates and returns a new mxConnectionHandler to be used in this graph.
mxGraph.prototype.createConnectionHandler = function()
Creates and returns a new mxGraphHandler to be used in this graph.
mxGraph.prototype.createGraphHandler = function()
Creates and returns a new mxPanningHandler to be used in this graph.
mxGraph.prototype.createPanningHandler = function()
Creates and returns a new mxPopupMenuHandler to be used in this graph.
mxGraph.prototype.createPopupMenuHandler = function()
Creates a new mxGraphSelectionModel to be used in this graph.
mxGraph.prototype.createSelectionModel = function()
Creates a new mxGraphSelectionModel to be used in this graph.
mxGraph.prototype.createStylesheet = function()
Creates a new mxGraphView to be used in this graph.
mxGraph.prototype.createGraphView = function()
Creates a new mxCellRenderer to be used in this graph.
mxGraph.prototype.createCellRenderer = function()
Creates a new mxCellEditor to be used in this graph.
mxGraph.prototype.createCellEditor = function()
Returns the mxGraphModel that contains the cells.
mxGraph.prototype.getModel = function()
Returns the mxGraphView that contains the mxCellStates.
mxGraph.prototype.getView = function()
Returns the mxStylesheet that defines the style.
mxGraph.prototype.getStylesheet = function()
Sets the mxStylesheet that defines the style.
mxGraph.prototype.setStylesheet = function( stylesheet )
Returns the mxGraphSelectionModel that contains the selection.
mxGraph.prototype.getSelectionModel = function()
Sets the mxSelectionModel that contains the selection.
mxGraph.prototype.setSelectionModel = function( selectionModel )
Returns the cells to be selected for the given array of changes.
mxGraph.prototype.getSelectionCellsForChanges = function( changes )
Called when the graph model changes.
mxGraph.prototype.graphModelChanged = function( changes )
Removes selection cells that are not in the model from the selection.
mxGraph.prototype.updateSelection = function()
Processes the given change and invalidates the respective cached data in view.
mxGraph.prototype.processChange = function( change )
Removes all cached information for the given cell and its descendants.
mxGraph.prototype.removeStateForCell = function( cell )
Returns the array of mxCellOverlays for the given cell or null, if no overlays are defined.
mxGraph.prototype.getCellOverlays = function( cell )
Removes all mxCellOverlays in the graph for the given cell and all its descendants.
mxGraph.prototype.clearCellOverlays = function( cell )
Creates an overlay for the given cell using the warning and image or warningImage and returns the new mxCellOverlay.
mxGraph.prototype.setCellWarning = function( cell, warning, img, isSelect )
Calls startEditingAtCell using the given cell or the first selection cell.
mxGraph.prototype.startEditing = function( evt )
Returns the initial value for in-place editing.
mxGraph.prototype.getEditingValue = function( cell, evt )
Creates and returns an mxPanningManager.
mxGraph.prototype.createPanningManager = function()
Returns the size of the border and padding on all four sides of the container.
mxGraph.prototype.getBorderSizes = function()
Returns the preferred size of the background page if preferPageSize is true.
mxGraph.prototype.getPreferredPageSize = function( bounds, width, height )
Resizes the container for the given graph width and height.
mxGraph.prototype.doResizeContainer = function( width, height )
Invokes from sizeDidChange to redraw the page breaks.
mxGraph.prototype.updatePageBreaks = function( visible, width, height )
Returns an array of key, value pairs representing the cell style for the given cell.
mxGraph.prototype.getCellStyle = function( cell )
Tries to resolve the value for the image style in the image bundles and turns short data URIs as defined in mxImageBundle to data URIs as defined in RFC 2397 of the IETF.
mxGraph.prototype.postProcessCellStyle = function( style )
Sets the style of the specified cells.
mxGraph.prototype.setCellStyle = function( style, cells )
Toggles the boolean value for the given key in the style of the given cell and returns the new value as 0 or 1.
mxGraph.prototype.toggleCellStyle = function( key, defaultValue, cell )
Toggles the boolean value for the given key in the style of the given cells and returns the new value as 0 or 1.
mxGraph.prototype.toggleCellStyles = function( key, defaultValue, cells )
Sets the key to value in the styles of the given cells.
mxGraph.prototype.setCellStyles = function( key, value, cells )
Toggles the given bit for the given key in the styles of the specified cells.
mxGraph.prototype.toggleCellStyleFlags = function( key, flag, cells )
Sets or toggles the given bit for the given key in the styles of the specified cells.
mxGraph.prototype.setCellStyleFlags = function( key, flag, value, cells )
Adds the specified mxImageBundle.
mxGraph.prototype.addImageBundle = function( bundle )
Removes the specified mxImageBundle.
mxGraph.prototype.removeImageBundle = function( bundle )
Searches all imageBundles for the specified key and returns the value for the first match or null if the key is not found.
mxGraph.prototype.getImageFromBundles = function( key )
Returns the cells with the same parent as the first cell in the given array.
mxGraph.prototype.getCellsForGroup = function( cells )
Returns the bounds to be used for the given group and children.
mxGraph.prototype.getBoundsForGroup = function( group, children, border )
Hook for creating the group cell to hold the given array of mxCells if no group cell was given to the group function.
mxGraph.prototype.createGroupCell = function( cells )
Hook to remove the groups after ungroupCells.
mxGraph.prototype.removeCellsAfterUngroup = function( cells )
Returns the bounding box for the given array of mxCells.
mxGraph.prototype.getBoundingBox = function( cells )
Returns the clone for the given cell.
mxGraph.prototype.cloneCell = function( cell, allowInvalidEdges, mapping, keepPosition )
Returns the clones for the given cells.
mxGraph.prototype.cloneCells = function( cells, allowInvalidEdges, mapping, keepPosition )
Adds a new vertex into the given parent mxCell using value as the user object and the given coordinates as the mxGeometry of the new vertex.
mxGraph.prototype.insertVertex = function( parent, id, value, x, y, width, height, style, relative )
Hook method that creates the new vertex for insertVertex.
mxGraph.prototype.createVertex = function( parent, id, value, x, y, width, height, style, relative )
Adds a new edge into the given parent mxCell using value as the user object and the given source and target as the terminals of the new edge.
mxGraph.prototype.insertEdge = function( parent, id, value, source, target, style )
Hook method that creates the new edge for insertEdge.
mxGraph.prototype.createEdge = function( parent, id, value, source, target, style )
Adds the edge to the parent and connects it to the given source and target terminals.
mxGraph.prototype.addEdge = function( edge, parent, source, target, index )
Adds the cell to the parent and connects it to the given source and target terminals.
mxGraph.prototype.addCell = function( cell, parent, index, source, target )
Resizes the specified cell to just fit around the its label and/or children
mxGraph.prototype.autoSizeCell = function( cell, recurse )
Sets the visible state of the specified cells.
mxGraph.prototype.cellsToggled = function( cells, show )
Sets the collapsed state of the specified cells.
mxGraph.prototype.cellsFolded = function( cells, collapse, recurse, checkFoldable )
Swaps the alternate and the actual bounds in the geometry of the given cell invoking updateAlternateBounds before carrying out the swap.
mxGraph.prototype.swapBounds = function( cell, willCollapse )
Updates or sets the alternate bounds in the given geometry for the given cell depending on whether the cell is going to be collapsed.
mxGraph.prototype.updateAlternateBounds = function( cell, geo, willCollapse )
Returns an array with the given cells and all edges that are connected to a cell or one of its descendants.
mxGraph.prototype.addAllEdges = function( cells )
Returns all edges connected to the given cells or its descendants.
mxGraph.prototype.getAllEdges = function( cells )
Updates the size of the given cell in the model using getPreferredSizeForCell to get the new size.
mxGraph.prototype.cellSizeUpdated = function( cell, ignoreChildren )
Returns the preferred width and height of the given mxCell as an mxRectangle.
mxGraph.prototype.getPreferredSizeForCell = function( cell )
Sets the bounds of the given cell using resizeCells.
mxGraph.prototype.resizeCell = function( cell, bounds, recurse )
Resizes the parents recursively so that they contain the complete area of the resized child cell.
mxGraph.prototype.cellResized = function( cell, bounds, ignoreRelative, recurse )
Resizes the child cells of the given cell for the given new geometry with respect to the current geometry of the cell.
mxGraph.prototype.resizeChildCells = function( cell, newGeo )
Constrains the children of the given cell using constrainChild.
mxGraph.prototype.constrainChildCells = function( cell )
Keeps the given cell inside the bounds returned by getCellContainmentArea for its parent, according to the rules defined by getOverlap and isConstrainChild.
mxGraph.prototype.constrainChild = function( cell, sizeFirst )
Scales the points, position and size of the given cell according to the given vertical and horizontal scaling factors.
mxGraph.prototype.scaleCell = function( cell, dx, dy, recurse )
Resizes the parents recursively so that they contain the complete area of the resized child cell.
mxGraph.prototype.extendParent = function( cell )
Clones and inserts the given cells into the graph using the move method and returns the inserted cells.
mxGraph.prototype.importCells = function( cells, dx, dy, target, evt, mapping )
Translates the geometry of the given cell and stores the new, translated geometry in the model as an atomic change.
mxGraph.prototype.translateCell = function( cell, dx, dy )
Returns the mxRectangle inside which a cell is to be kept.
mxGraph.prototype.getCellContainmentArea = function( cell )
Returns the bounds inside which the diagram should be kept as an mxRectangle.
mxGraph.prototype.getMaximumGraphBounds = function()
Returns true if the given cell should be kept inside the bounds of its parent according to the rules defined by getOverlap and isAllowOverlapParent.
mxGraph.prototype.isConstrainChild = function( cell )
Resets the control points of the edges that are connected to the given cells if not both ends of the edge are in the given cells array.
mxGraph.prototype.resetEdges = function( cells )
Resets the control points of the given edge.
mxGraph.prototype.resetEdge = function( edge )
Returns the constraint used to connect to the outline of the given state.
mxGraph.prototype.getOutlineConstraint = function( point, terminalState, me )
Returns an array of all mxConnectionConstraints for the given terminal.
mxGraph.prototype.getAllConnectionConstraints = function( terminal, source )
Returns an mxConnectionConstraint that describes the given connection point.
mxGraph.prototype.getConnectionConstraint = function( edge, terminal, source )
Sets the mxConnectionConstraint that describes the given connection point.
mxGraph.prototype.setConnectionConstraint = function( edge, terminal, source, constraint )
Returns the nearest point in the list of absolute points or the center of the opposite terminal.
mxGraph.prototype.getConnectionPoint = function( vertex, constraint, round )
Disconnects the given edges from the terminals which are not in the given array.
mxGraph.prototype.disconnectGraph = function( cells )
Returns the current root of the displayed cell hierarchy.
mxGraph.prototype.getCurrentRoot = function()
Returns the translation to be used if the given cell is the root cell as an mxPoint.
mxGraph.prototype.getTranslateForRoot = function( cell )
Returns true if the given cell is a “port”, that is, when connecting to it, the cell returned by getTerminalForPort should be used as the terminal and the port should be referenced by the ID in either the mxConstants.STYLE_SOURCE_PORT or the or the mxConstants.STYLE_TARGET_PORT.
mxGraph.prototype.isPort = function( cell )
Returns the terminal to be used for a given port.
mxGraph.prototype.getTerminalForPort = function( cell, source )
Returns the offset to be used for the cells inside the given cell.
mxGraph.prototype.getChildOffsetForCell = function( cell )
Uses the given cell as the root of the displayed cell hierarchy.
mxGraph.prototype.enterGroup = function( cell )
Changes the current root to the next valid root in the displayed cell hierarchy.
mxGraph.prototype.exitGroup = function()
Uses the root of the model as the root of the displayed cell hierarchy and selects the previous root.
mxGraph.prototype.home = function()
Returns true if the given cell is a valid root for the cell display hierarchy.
mxGraph.prototype.isValidRoot = function( cell )
Returns the bounds of the visible graph.
mxGraph.prototype.getGraphBounds = function()
Returns the scaled, translated bounds for the given cell.
mxGraph.prototype.getCellBounds = function( cell, includeEdges, includeDescendants )
Returns the bounding box for the geometries of the vertices in the given array of cells.
mxGraph.prototype.getBoundingBoxFromGeometry = function( cells, includeEdges )
Snaps the given numeric value to the grid if gridEnabled is true.
mxGraph.prototype.snap = function( value )
Resets the zoom and panning in the view.
mxGraph.prototype.zoomActual = function()
Zooms the graph to the given scale with an optional boolean center argument, which is passd to zoom.
mxGraph.prototype.zoomTo = function( scale, center )
Zooms the graph using the given factor.
mxGraph.prototype.zoom = function( factor, center )
Centers the graph in the container.
mxGraph.prototype.center = function( horizontal, vertical, cx, cy )
Zooms the graph to the specified rectangle.
mxGraph.prototype.zoomToRect = function( rect )
Pans the graph so that it shows the given cell.
mxGraph.prototype.scrollCellToVisible = function( cell, center )
Pans the graph so that it shows the given rectangle.
mxGraph.prototype.scrollRectToVisible = function( rect )
Returns the mxGeometry for the given cell.
mxGraph.prototype.getCellGeometry = function( cell )
Returns true if the given cell is visible in this graph.
mxGraph.prototype.isCellVisible = function( cell )
Returns true if the given cell is collapsed in this graph.
mxGraph.prototype.isCellCollapsed = function( cell )
Returns true if the given cell is connectable in this graph.
mxGraph.prototype.isCellConnectable = function( cell )
Returns true if perimeter points should be computed such that the resulting edge has only horizontal or vertical segments.
mxGraph.prototype.isOrthogonal = function( edge )
Returns true if the given cell state is a loop.
mxGraph.prototype.isLoop = function( state )
Returns true if the given event is a clone event.
mxGraph.prototype.isCloneEvent = function( evt )
Hook for implementing click-through behaviour on selected cells.
mxGraph.prototype.isTransparentClickEvent = function( evt )
Returns true if the given event is a toggle event.
mxGraph.prototype.isToggleEvent = function( evt )
Returns true if the given mouse event should be aligned to the grid.
mxGraph.prototype.isGridEnabledEvent = function( evt )
Returns true if the given mouse event should be aligned to the grid.
mxGraph.prototype.isConstrainedEvent = function( evt )
Returns true if the given mouse event should not allow any connections to be made.
mxGraph.prototype.isIgnoreTerminalEvent = function( evt )
Displays the given validation error in a dialog.
mxGraph.prototype.validationAlert = function( message )
Checks if the return value of getEdgeValidationError for the given arguments is null.
mxGraph.prototype.isEdgeValid = function( edge, source, target )
Returns the validation error message to be displayed when inserting or changing an edges’ connectivity.
mxGraph.prototype.getEdgeValidationError = function( edge, source, target )
Hook method for subclassers to return an error message for the given edge and terminals.
mxGraph.prototype.validateEdge = function( edge, source, target )
Validates the graph by validating each descendant of the given cell or the root of the model.
mxGraph.prototype.validateGraph = function( cell, context )
Checks all multiplicities that cannot be enforced while the graph is being modified, namely, all multiplicities that require a minimum of 1 edge.
mxGraph.prototype.getCellValidationError = function( cell )
Hook method for subclassers to return an error message for the given cell and validation context.
mxGraph.prototype.validateCell = function( cell, context )
Sets the new backgroundImage.
mxGraph.prototype.setBackgroundImage = function( image )
Returns the mxImage used to display the collapsed state of the specified cell state.
mxGraph.prototype.getFoldingImage = function( state )
Returns the textual representation for the given cell.
mxGraph.prototype.convertValueToString = function( cell )
Returns a string or DOM node that represents the label for the given cell.
mxGraph.prototype.getLabel = function( cell )
Returns htmlLabels.
mxGraph.prototype.isHtmlLabels = function()
Sets htmlLabels.
mxGraph.prototype.setHtmlLabels = function( value )
This enables wrapping for HTML labels.
mxGraph.prototype.isWrapping = function( cell )
Returns true if the overflow portion of labels should be hidden.
mxGraph.prototype.isLabelClipped = function( cell )
Returns the string or DOM node that represents the tooltip for the given state, node and coordinate pair.
mxGraph.prototype.getTooltip = function( state, node, x, y )
Returns the string or DOM node to be used as the tooltip for the given cell.
mxGraph.prototype.getTooltipForCell = function( cell )
Returns the string to be used as the link for the given cell.
mxGraph.prototype.getLinkForCell = function( cell )
Returns the cursor value to be used for the CSS of the shape for the given event.
mxGraph.prototype.getCursorForMouseEvent = function( me )
Returns the cursor value to be used for the CSS of the shape for the given cell.
mxGraph.prototype.getCursorForCell = function( cell )
Returns the start size of the given swimlane, that is, the width or height of the part that contains the title, depending on the horizontal style.
mxGraph.prototype.getStartSize = function( swimlane )
Returns the image URL for the given cell state.
mxGraph.prototype.getImage = function( state )
Returns the vertical alignment for the given cell state.
mxGraph.prototype.getVerticalAlign = function( state )
Returns the indicator color for the given cell state.
mxGraph.prototype.getIndicatorColor = function( state )
Returns the indicator gradient color for the given cell state.
mxGraph.prototype.getIndicatorGradientColor = function( state )
Returns the indicator shape for the given cell state.
mxGraph.prototype.getIndicatorShape = function( state )
Returns the indicator image for the given cell state.
mxGraph.prototype.getIndicatorImage = function( state )
Returns the value of border.
mxGraph.prototype.getBorder = function()
Sets the value of border.
mxGraph.prototype.setBorder = function( value )
Returns true if the given cell is a swimlane in the graph.
mxGraph.prototype.isSwimlane = function ( cell )
Returns resizeContainer.
mxGraph.prototype.isResizeContainer = function()
Sets resizeContainer.
mxGraph.prototype.setResizeContainer = function( value )
Specifies if the graph should allow any interactions.
mxGraph.prototype.setEnabled = function( value )
Returns escapeEnabled.
mxGraph.prototype.isEscapeEnabled = function()
Sets escapeEnabled.
mxGraph.prototype.setEscapeEnabled = function( value )
Returns invokesStopCellEditing.
mxGraph.prototype.isInvokesStopCellEditing = function()
Sets invokesStopCellEditing.
mxGraph.prototype.setInvokesStopCellEditing = function( value )
Returns enterStopsCellEditing.
mxGraph.prototype.isEnterStopsCellEditing = function()
Sets enterStopsCellEditing.
mxGraph.prototype.setEnterStopsCellEditing = function( value )
Returns true if the given cell may not be moved, sized, bended, disconnected, edited or selected.
mxGraph.prototype.isCellsLocked = function()
Sets if any cell may be moved, sized, bended, disconnected, edited or selected.
mxGraph.prototype.setCellsLocked = function( value )
Returns the cells which may be exported in the given array of cells.
mxGraph.prototype.getCloneableCells = function( cells )
Returns cellsCloneable, that is, if the graph allows cloning of cells by using control-drag.
mxGraph.prototype.isCellsCloneable = function()
Specifies if the graph should allow cloning of cells by holding down the control key while cells are being moved.
mxGraph.prototype.setCellsCloneable = function( value )
Returns the cells which may be exported in the given array of cells.
mxGraph.prototype.getExportableCells = function( cells )
Returns the cells which may be imported in the given array of cells.
mxGraph.prototype.getImportableCells = function( cells )
Returns cellsSelectable.
mxGraph.prototype.isCellsSelectable = function()
Sets cellsSelectable.
mxGraph.prototype.setCellsSelectable = function( value )
Returns the cells which may be exported in the given array of cells.
mxGraph.prototype.getDeletableCells = function( cells )
Returns cellsDeletable.
mxGraph.prototype.isCellsDeletable = function()
Sets cellsDeletable.
mxGraph.prototype.setCellsDeletable = function( value )
Returns true if the given cell is rotatable.
mxGraph.prototype.isCellRotatable = function( cell )
Returns the cells which are movable in the given array of cells.
mxGraph.prototype.getMovableCells = function( cells )
Returns cellsMovable.
mxGraph.prototype.isCellsMovable = function()
Specifies if the graph should allow moving of cells.
mxGraph.prototype.setCellsMovable = function( value )
Returns gridEnabled as a boolean.
mxGraph.prototype.isGridEnabled = function()
Specifies if the grid should be enabled.
mxGraph.prototype.setGridEnabled = function( value )
Returns portsEnabled as a boolean.
mxGraph.prototype.isPortsEnabled = function()
Specifies if the ports should be enabled.
mxGraph.prototype.setPortsEnabled = function( value )
Returns gridSize.
mxGraph.prototype.getGridSize = function()
Sets gridSize.
mxGraph.prototype.setGridSize = function( value )
Returns tolerance.
mxGraph.prototype.getTolerance = function()
Sets tolerance.
mxGraph.prototype.setTolerance = function( value )
Returns vertexLabelsMovable.
mxGraph.prototype.isVertexLabelsMovable = function()
Sets vertexLabelsMovable.
mxGraph.prototype.setVertexLabelsMovable = function( value )
Returns edgeLabelsMovable.
mxGraph.prototype.isEdgeLabelsMovable = function()
Returns swimlaneNesting as a boolean.
mxGraph.prototype.isSwimlaneNesting = function()
Specifies if swimlanes can be nested by drag and drop.
mxGraph.prototype.setSwimlaneNesting = function( value )
Returns swimlaneSelectionEnabled as a boolean.
mxGraph.prototype.isSwimlaneSelectionEnabled = function()
Specifies if swimlanes should be selected if the mouse is released over their content area.
mxGraph.prototype.setSwimlaneSelectionEnabled = function( value )
Returns multigraph as a boolean.
mxGraph.prototype.isMultigraph = function()
Specifies if the graph should allow multiple connections between the same pair of vertices.
mxGraph.prototype.setMultigraph = function( value )
Returns allowLoops as a boolean.
mxGraph.prototype.isAllowLoops = function()
Specifies if dangling edges are allowed, that is, if edges are allowed that do not have a source and/or target terminal defined.
mxGraph.prototype.setAllowDanglingEdges = function( value )
Returns allowDanglingEdges as a boolean.
mxGraph.prototype.isAllowDanglingEdges = function()
Specifies if edges should be connectable.
mxGraph.prototype.setConnectableEdges = function( value )
Returns connectableEdges as a boolean.
mxGraph.prototype.isConnectableEdges = function()
Specifies if edges should be inserted when cloned but not valid wrt.
mxGraph.prototype.setCloneInvalidEdges = function( value )
Returns cloneInvalidEdges as a boolean.
mxGraph.prototype.isCloneInvalidEdges = function()
Specifies if loops are allowed.
mxGraph.prototype.setAllowLoops = function( value )
Returns disconnectOnMove as a boolean.
mxGraph.prototype.isDisconnectOnMove = function()
Specifies if edges should be disconnected when moved.
mxGraph.prototype.setDisconnectOnMove = function( value )
Specifies if the graph should allow dropping of cells onto or into other cells.
mxGraph.prototype.setDropEnabled = function( value )
Returns splitEnabled as a boolean.
mxGraph.prototype.isSplitEnabled = function()
Specifies if the graph should allow dropping of cells onto or into other cells.
mxGraph.prototype.setSplitEnabled = function( value )
Returns cellsResizable.
mxGraph.prototype.isCellsResizable = function()
Specifies if the graph should allow resizing of cells.
mxGraph.prototype.setCellsResizable = function( value )
Returns true if the given terminal point is movable.
mxGraph.prototype.isTerminalPointMovable = function( cell, source )
Returns true if the given cell is bendable.
mxGraph.prototype.isCellBendable = function( cell )
Specifies if the graph should allow bending of edges.
mxGraph.prototype.setCellsBendable = function( value )
Returns cellsEditable.
mxGraph.prototype.isCellsEditable = function()
Specifies if the graph should allow in-place editing for cell labels.
mxGraph.prototype.setCellsEditable = function( value )
Returns true if the given cell is disconnectable from the source or target terminal.
mxGraph.prototype.isCellDisconnectable = function( cell, terminal, source )
Returns cellsDisconnectable.
mxGraph.prototype.isCellsDisconnectable = function()
Sets cellsDisconnectable.
mxGraph.prototype.setCellsDisconnectable = function( value )
Returns true if the given cell is a valid source for new connections.
mxGraph.prototype.isValidSource = function( cell )
Returns isValidSource for the given cell.
mxGraph.prototype.isValidTarget = function( cell )
Returns true if the given target cell is a valid target for source.
mxGraph.prototype.isValidConnection = function( source, target )
Specifies if the graph should allow new connections.
mxGraph.prototype.setConnectable = function( connectable )
Returns true if the connectionHandler is enabled.
mxGraph.prototype.isConnectable = function()
Specifies if tooltips should be enabled.
mxGraph.prototype.setTooltips = function ( enabled )
Specifies if panning should be enabled.
mxGraph.prototype.setPanning = function( enabled )
Returns true if the given cell is currently being edited.
mxGraph.prototype.isEditing = function( cell )
Returns true if the size of the given cell should automatically be updated after a change of the label.
mxGraph.prototype.isAutoSizeCell = function( cell )
Returns autoSizeCells.
mxGraph.prototype.isAutoSizeCells = function()
Specifies if cell sizes should be automatically updated after a label change.
mxGraph.prototype.setAutoSizeCells = function( value )
Returns true if the parent of the given cell should be extended if the child has been resized so that it overlaps the parent.
mxGraph.prototype.isExtendParent = function( cell )
Returns extendParents.
mxGraph.prototype.isExtendParents = function()
Sets extendParents.
mxGraph.prototype.setExtendParents = function( value )
Returns extendParentsOnAdd.
mxGraph.prototype.isExtendParentsOnAdd = function( cell )
Sets extendParentsOnAdd.
mxGraph.prototype.setExtendParentsOnAdd = function( value )
Returns extendParentsOnMove.
mxGraph.prototype.isExtendParentsOnMove = function()
Sets extendParentsOnMove.
mxGraph.prototype.setExtendParentsOnMove = function( value )
Sets recursiveResize.
mxGraph.prototype.setRecursiveResize = function( value )
Returns constrainChildren.
mxGraph.prototype.isConstrainChildren = function()
Sets constrainChildren.
mxGraph.prototype.setConstrainChildren = function( value )
Returns constrainRelativeChildren.
mxGraph.prototype.isConstrainRelativeChildren = function()
Sets constrainRelativeChildren.
mxGraph.prototype.setConstrainRelativeChildren = function( value )
Returns the cells which are movable in the given array of cells.
mxGraph.prototype.getFoldableCells = function( cells, collapse )
Returns true if the given cell is foldable.
mxGraph.prototype.isCellFoldable = function( cell, collapse )
Returns true if the given cell is a valid drop target for the specified cells.
mxGraph.prototype.isValidDropTarget = function( cell, cells, evt )
Returns true if the given edge may be splitted into two edges with the given cell as a new terminal between the two.
mxGraph.prototype.isSplitTarget = function( target, cells, evt )
Returns the given cell if it is a drop target for the given cells or the nearest ancestor that may be used as a drop target for the given cells.
mxGraph.prototype.getDropTarget = function( cells, evt, cell, clone )
Returns defaultParent or mxGraphView.currentRoot or the first child child of mxGraphModel.root if both are null.
mxGraph.prototype.getDefaultParent = function()
Sets the defaultParent to the given cell.
mxGraph.prototype.setDefaultParent = function( cell )
Returns the nearest ancestor of the given cell which is a swimlane, or the given cell, if it is itself a swimlane.
mxGraph.prototype.getSwimlane = function( cell )
Returns the bottom-most swimlane that intersects the given point (x, y) in the cell hierarchy that starts at the given parent.
mxGraph.prototype.getSwimlaneAt = function ( x, y, parent )
Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy starting at the given parent.
mxGraph.prototype.getCellAt = function( x, y, parent, vertices, edges, ignoreFn )
Returns the bottom-most cell that intersects the given point (x, y) in the cell hierarchy that starts at the given parent.
mxGraph.prototype.intersects = function( state, x, y )
Returns true if the given coordinate pair is inside the content are of the given swimlane.
mxGraph.prototype.hitsSwimlaneContent = function( swimlane, x, y )
Returns the visible child vertices of the given parent.
mxGraph.prototype.getChildVertices = function( parent )
Returns the visible child edges of the given parent.
mxGraph.prototype.getChildEdges = function( parent )
Returns the visible child vertices or edges in the given parent.
mxGraph.prototype.getChildCells = function( parent, vertices, edges )
Returns all visible edges connected to the given cell without loops.
mxGraph.prototype.getConnections = function( cell, parent )
Returns the visible incoming edges for the given cell.
mxGraph.prototype.getIncomingEdges = function( cell, parent )
Returns the visible outgoing edges for the given cell.
mxGraph.prototype.getOutgoingEdges = function( cell, parent )
Returns the incoming and/or outgoing edges for the given cell.
mxGraph.prototype.getEdges = function( cell, parent, incoming, outgoing, includeLoops, recurse )
Returns whether or not the specified parent is a valid ancestor of the specified cell, either direct or indirectly based on whether ancestor recursion is enabled.
mxGraph.prototype.isValidAncestor = function( cell, parent, recurse )
Returns all distinct visible opposite cells for the specified terminal on the given edges.
mxGraph.prototype.getOpposites = function( edges, terminal, sources, targets )
Returns the edges between the given source and target.
mxGraph.prototype.getEdgesBetween = function( source, target, directed )
Returns an mxPoint representing the given event in the unscaled, non-translated coordinate space of container and applies the grid.
mxGraph.prototype.getPointForEvent = function( evt, addOffset )
Returns the child vertices and edges of the given parent that are contained in the given rectangle.
mxGraph.prototype.getCells = function( x, y, width, height, parent, result )
Returns the children of the given parent that are contained in the halfpane from the given point (x0, y0) rightwards or downwards depending on rightHalfpane and bottomHalfpane.
mxGraph.prototype.getCellsBeyond = function( x0, y0, parent, rightHalfpane, bottomHalfpane )
Returns all children in the given parent which do not have incoming edges.
mxGraph.prototype.findTreeRoots = function( parent, isolate, invert )
Traverses the (directed) graph invoking the given function for each visited vertex and edge.
mxGraph.prototype.traverse = function( vertex, directed, func, edge, visited, inverse )
Returns true if the given cell is selected.
mxGraph.prototype.isCellSelected = function( cell )
Returns true if the selection is empty.
mxGraph.prototype.isSelectionEmpty = function()
Clears the selection using mxGraphSelectionModel.clear.
mxGraph.prototype.clearSelection = function()
Returns the number of selected cells.
mxGraph.prototype.getSelectionCount = function()
Returns the first cell from the array of selected mxCells.
mxGraph.prototype.getSelectionCell = function()
Returns the array of selected mxCells.
mxGraph.prototype.getSelectionCells = function()
Sets the selection cell.
mxGraph.prototype.setSelectionCell = function( cell )
Sets the selection cell.
mxGraph.prototype.setSelectionCells = function( cells )
Adds the given cell to the selection.
mxGraph.prototype.addSelectionCell = function( cell )
Adds the given cells to the selection.
mxGraph.prototype.addSelectionCells = function( cells )
Removes the given cell from the selection.
mxGraph.prototype.removeSelectionCell = function( cell )
Removes the given cells from the selection.
mxGraph.prototype.removeSelectionCells = function( cells )
Selects and returns the cells inside the given rectangle for the specified event.
mxGraph.prototype.selectRegion = function( rect, evt )
Selects the next cell.
mxGraph.prototype.selectNextCell = function()
Selects the previous cell.
mxGraph.prototype.selectPreviousCell = function()
Selects the parent cell.
mxGraph.prototype.selectParentCell = function()
Selects the first child cell.
mxGraph.prototype.selectChildCell = function()
Selects the next, parent, first child or previous cell, if all arguments are false.
mxGraph.prototype.selectCell = function( isNext, isParent, isChild )
Selects all children of the given parent cell or the children of the default parent if no parent is specified.
mxGraph.prototype.selectAll = function( parent, descendants )
Select all vertices inside the given parent or the default parent.
mxGraph.prototype.selectVertices = function( parent )
Selects all vertices and/or edges depending on the given boolean arguments recursively, starting at the given parent or the default parent if no parent is specified.
mxGraph.prototype.selectCells = function( vertices, edges, parent )
Selects the given cell by either adding it to the selection or replacing the selection depending on whether the given mouse event is a toggle event.
mxGraph.prototype.selectCellForEvent = function( cell, evt )
Selects the given cells by either adding them to the selection or replacing the selection depending on whether the given mouse event is a toggle event.
mxGraph.prototype.selectCellsForEvent = function( cells, evt )
Creates a new handler for the given cell state.
mxGraph.prototype.createHandler = function( state )
Hooks to create a new mxVertexHandler for the given mxCellState.
mxGraph.prototype.createVertexHandler = function( state )
Hooks to create a new mxEdgeHandler for the given mxCellState.
mxGraph.prototype.createEdgeHandler = function( state, edgeStyle )
Hooks to create a new mxEdgeSegmentHandler for the given mxCellState.
mxGraph.prototype.createEdgeSegmentHandler = function( state )
Hooks to create a new mxElbowEdgeHandler for the given mxCellState.
mxGraph.prototype.createElbowEdgeHandler = function( state )
Adds a listener to the graph event dispatch loop.
mxGraph.prototype.addMouseListener = function( listener )
Removes the specified graph listener.
mxGraph.prototype.removeMouseListener = function( listener )
Sets the graphX and graphY properties if the given mxMouseEvent if required and returned the event.
mxGraph.prototype.updateMouseEvent = function( me, evtName )
Returns true if the event should be ignored in fireMouseEvent.
mxGraph.prototype.isEventIgnored = function( evtName, me, sender )
Hook for ignoring synthetic mouse events after touchend in Firefox.
mxGraph.prototype.isSyntheticEventIgnored = function( evtName, me, sender )
Returns true if the event should be ignored in fireMouseEvent.
mxGraph.prototype.isEventSourceIgnored = function( evtName, me )
Returns the mxCellState to be used when firing the mouse event for the given state.
mxGraph.prototype.getEventState = function( state )
Consumes the given mxMouseEvent if it’s a touchStart event.
mxGraph.prototype.consumeMouseEvent = function( evtName, me, sender )
Destroys the graph and all its resources.
mxGraph.prototype.destroy = function()
Constructs a new overlay using the given image and tooltip.
function mxCellOverlay( image, tooltip, align, verticalAlign, offset, cursor )
Holds the mxImage to be used as the icon.
mxCellOverlay.prototype.image
Holds the optional string to be used as the tooltip.
mxCellOverlay.prototype.tooltip
Holds the horizontal alignment for the overlay.
mxCellOverlay.prototype.align
Holds the vertical alignment for the overlay.
mxCellOverlay.prototype.verticalAlign
Holds the offset as an mxPoint.
mxCellOverlay.prototype.offset
Holds the cursor for the overlay.
mxCellOverlay.prototype.cursor
Defines the overlapping for the overlay, that is, the proportional distance from the origin to the point defined by the alignment.
mxCellOverlay.prototype.defaultOverlap
Returns the bounds of the overlay for the given mxCellState as an mxRectangle.
mxCellOverlay.prototype.getBounds = function( state )
Returns the textual representation of the overlay to be used as the tooltip.
mxCellOverlay.prototype.toString = function()
Constructs a new outline for the specified graph inside the given container.
function mxOutline( source, container )
Specifies if events are handled.
mxOutline.prototype.enabled
Specifies a viewport rectangle should be shown.
mxOutline.prototype.showViewport
Border to be added at the bottom and right.
mxOutline.prototype.border
Specifies if labels should be visible in the outline.
mxOutline.prototype.labelsVisible
Specifies if update should be called for mxEvent.PAN in the source graph.
mxOutline.prototype.updateOnPan
Updates the outline.
mxOutline.prototype.update = function( revalidate )
Optional mxImage to be used for the sizer.
mxOutline.prototype.sizerImage
Minimum scale to be used.
mxOutline.prototype.minScale
Optional boolean flag to suspend updates.
mxOutline.prototype.suspended
Specifies if VML should be used to render the handles in this control.
mxOutline.prototype.forceVmlHandles
Creates the mxGraph used in the outline.
mxOutline.prototype.createGraph = function( container )
Initializes the outline inside the given container.
mxOutline.prototype.init = function( container )
Returns true if events are handled.
mxOutline.prototype.isEnabled = function()
Enables or disables event handling.
mxOutline.prototype.setEnabled = function( value )
Enables or disables the zoom handling by showing or hiding the respective handle.
mxOutline.prototype.setZoomEnabled = function( value )
Invokes update and revalidate the outline.
mxOutline.prototype.refresh = function()
Creates the shape used as the sizer.
mxOutline.prototype.createSizer = function()
Returns the size of the source container.
mxOutline.prototype.getSourceContainerSize = function()
Returns the offset for drawing the outline graph.
mxOutline.prototype.getOutlineOffset = function( scale )
Handles the event by starting a translation or zoom.
mxOutline.prototype.mouseDown = function( sender, me )
Handles the event by previewing the viewrect in graph and updating the rectangle that represents the viewrect in the outline.
mxOutline.prototype.mouseMove = function( sender, me )
Gets the translate for the given mouse event.
mxOutline.prototype.getTranslateForEvent = function( me )
Handles the event by applying the translation or zoom to graph.
mxOutline.prototype.mouseUp = function( sender, me )
Destroy this outline and removes all listeners from source.
mxOutline.prototype.destroy = function()
Instantiate class mxMultiplicity in order to describe allowed connections in a graph.
function mxMultiplicity( source, type, attr, value, min, max, validNeighbors, countError, typeError, validNeighborsAllowed )
Defines the type of the source or target terminal.
mxMultiplicity.prototype.type
Optional string that specifies the attributename to be passed to mxUtils.isNode to check if the rule applies to a cell.
mxMultiplicity.prototype.attr
Optional string that specifies the value of the attribute to be passed to mxUtils.isNode to check if the rule applies to a cell.
mxMultiplicity.prototype.value
Boolean that specifies if the rule is applied to the source or target terminal of an edge.
mxMultiplicity.prototype.source
Defines the minimum number of connections for which this rule applies.
mxMultiplicity.prototype.min
Defines the maximum number of connections for which this rule applies.
mxMultiplicity.prototype.max
Holds an array of strings that specify the type of neighbor for which this rule applies.
mxMultiplicity.prototype.validNeighbors
Boolean indicating if the list of validNeighbors are those that are allowed for this rule or those that are not allowed for this rule.
mxMultiplicity.prototype.validNeighborsAllowed
Holds the localized error message to be displayed if the number of connections for which the rule applies is smaller than min or greater than max.
mxMultiplicity.prototype.countError
Holds the localized error message to be displayed if the type of the neighbor for a connection does not match the rule.
mxMultiplicity.prototype.typeError
Checks the multiplicity for the given arguments and returns the error for the given connection or null if the multiplicity does not apply.
mxMultiplicity.prototype.check = function( graph, edge, source, target, sourceOut, targetIn )
Checks if there are any valid neighbours in validNeighbors.
mxMultiplicity.prototype.checkNeighbors = function( graph, edge, source, target )
Checks the given terminal cell and returns true if this rule applies.
mxMultiplicity.prototype.checkTerminal = function( graph, terminal, edge )
Checks the type of the given value.
mxMultiplicity.prototype.checkType = function( graph, value, type, attr, attrValue )
Executes all layouts which have been scheduled during the changes.
mxLayoutManager.prototype.layoutCells = function( cells )
Constructs a new automatic layout for the given graph.
function mxLayoutManager( graph )
Reference to the enclosing mxGraph.
mxLayoutManager.prototype.graph
Specifies if the layout should bubble along the cell hierarchy.
mxLayoutManager.prototype.bubbling
Specifies if event handling is enabled.
mxLayoutManager.prototype.enabled
Holds the function that handles the endUpdate event.
mxLayoutManager.prototype.updateHandler
Holds the function that handles the move event.
mxLayoutManager.prototype.moveHandler
Returns true if events are handled.
mxLayoutManager.prototype.isEnabled = function()
Enables or disables event handling.
mxLayoutManager.prototype.setEnabled = function( enabled )
Returns true if a layout should bubble, that is, if the parent layout should be executed whenever a cell layout (layout of the children of a cell) has been executed.
mxLayoutManager.prototype.isBubbling = function()
Sets bubbling.
mxLayoutManager.prototype.setBubbling = function( value )
Returns the graph that this layout operates on.
mxLayoutManager.prototype.getGraph = function()
Sets the graph that the layouts operate on.
mxLayoutManager.prototype.setGraph = function( graph )
Returns the layout to be executed for the given graph and parent.
mxLayoutManager.prototype.getLayout = function( parent )
Called from the undoHandler.
mxLayoutManager.prototype.beforeUndo = function( undoableEdit )
Executes the given layout on the given parent.
mxLayoutManager.prototype.executeLayoutForCells = function( cells )
Called from the moveHandler.
mxLayoutManager.prototype.cellsMoved = function( cells, evt )
Executes all layouts which have been scheduled during the changes.
mxLayoutManager.prototype.getCellsForChange = function( change )
Removes all handlers from the graph and deletes the reference to it.
mxLayoutManager.prototype.destroy = function()
Constructs a new swimlane manager for the given graph.
function mxSwimlaneManager( graph, horizontal, addEnabled, resizeEnabled )
Reference to the enclosing mxGraph.
mxSwimlaneManager.prototype.graph
Specifies if event handling is enabled.
mxSwimlaneManager.prototype.enabled
Specifies the orientation of the swimlanes.
mxSwimlaneManager.prototype.horizontal
Specifies if newly added cells should be resized to match the size of their existing siblings.
mxSwimlaneManager.prototype.addEnabled
Specifies if resizing of swimlanes should be handled.
mxSwimlaneManager.prototype.resizeEnabled
Returns true if events are handled.
mxSwimlaneManager.prototype.isEnabled = function()
Enables or disables event handling.
mxSwimlaneManager.prototype.setEnabled = function( value )
Returns horizontal.
mxSwimlaneManager.prototype.isHorizontal = function()
Sets horizontal.
mxSwimlaneManager.prototype.setHorizontal = function( value )
Returns addEnabled.
mxSwimlaneManager.prototype.isAddEnabled = function()
Sets addEnabled.
mxSwimlaneManager.prototype.setAddEnabled = function( value )
Returns resizeEnabled.
mxSwimlaneManager.prototype.isResizeEnabled = function()
Sets resizeEnabled.
mxSwimlaneManager.prototype.setResizeEnabled = function( value )
Returns the graph that this manager operates on.
mxSwimlaneManager.prototype.getGraph = function()
Sets the graph that the manager operates on.
mxSwimlaneManager.prototype.setGraph = function( graph )
Returns true if the given swimlane should be ignored.
mxSwimlaneManager.prototype.isSwimlaneIgnored = function( swimlane )
Returns true if the given cell is horizontal.
mxSwimlaneManager.prototype.isCellHorizontal = function( cell )
Called if any cells have been added.
mxSwimlaneManager.prototype.cellsAdded = function( cells )
Updates the size of the given swimlane to match that of any existing siblings swimlanes.
mxSwimlaneManager.prototype.swimlaneAdded = function( swimlane )
Called if any cells have been resizes.
mxSwimlaneManager.prototype.cellsResized = function( cells )
Called from cellsResized for all swimlanes that are not ignored to update the size of the siblings and the size of the parent swimlanes, recursively, if bubbling is true.
mxSwimlaneManager.prototype.resizeSwimlane = function( swimlane, w, h, parentHorizontal )
Removes all handlers from the graph and deletes the reference to it.
mxSwimlaneManager.prototype.destroy = function()
Holds the width of the rectangle.
mxTemporaryCellStates.prototype.view
Holds the height of the rectangle.
mxTemporaryCellStates.prototype.oldStates
Holds the height of the rectangle.
mxTemporaryCellStates.prototype.oldBounds
Holds the height of the rectangle.
mxTemporaryCellStates.prototype.oldScale
Returns the top, left corner as a new mxPoint.
mxTemporaryCellStates.prototype.destroy = function()
Constructs a move preview for the given graph.
function mxCellStatePreview( graph )
Reference to the enclosing mxGraph.
mxCellStatePreview.prototype.graph
Reference to the enclosing mxGraph.
mxCellStatePreview.prototype.deltas
Contains the number of entries in the map.
mxCellStatePreview.prototype.count
Returns true if this contains no entries.
mxCellStatePreview.prototype.isEmpty = function()
mxCellStatePreview.prototype.show = function( visitor )
mxCellStatePreview.prototype.translateState = function( state, dx, dy )
mxCellStatePreview.prototype.revalidateState = function( state, dx, dy, visitor )
mxCellStatePreview.prototype.addEdges = function( state )
Constructs a new connection constraint for the given point and boolean arguments.
function mxConnectionConstraint( point, perimeter, name, dx, dy )
mxPoint that specifies the fixed location of the connection point.
mxConnectionConstraint.prototype.point
Boolean that specifies if the point should be projected onto the perimeter of the terminal.
mxConnectionConstraint.prototype.perimeter
Optional string that specifies the name of the constraint.
mxConnectionConstraint.prototype.name
Optional float that specifies the horizontal offset of the constraint.
mxConnectionConstraint.prototype.dx
Optional float that specifies the vertical offset of the constraint.
mxConnectionConstraint.prototype.dy
Constructs an event handler that creates handles for the selection cells.
function mxGraphHandler( graph )
Reference to the enclosing mxGraph.
mxGraphHandler.prototype.graph
Defines the maximum number of cells to paint subhandles for.
mxGraphHandler.prototype.maxCells
Specifies if events are handled.
mxGraphHandler.prototype.enabled
Specifies if drop targets under the mouse should be enabled.
mxGraphHandler.prototype.highlightEnabled
Specifies if cloning by control-drag is enabled.
mxGraphHandler.prototype.cloneEnabled
Specifies if moving is enabled.
mxGraphHandler.prototype.moveEnabled
Specifies if other cells should be used for snapping the right, center or left side of the current selection.
mxGraphHandler.prototype.guidesEnabled
Holds the mxGuide instance that is used for alignment.
mxGraphHandler.prototype.guide
Stores the x-coordinate of the current mouse move.
mxGraphHandler.prototype.currentDx
Stores the y-coordinate of the current mouse move.
mxGraphHandler.prototype.currentDy
Specifies if a move cursor should be shown if the mouse is over a movable cell.
mxGraphHandler.prototype.updateCursor
Specifies if selecting is enabled.
mxGraphHandler.prototype.selectEnabled
Specifies if cells may be moved out of their parents.
mxGraphHandler.prototype.removeCellsFromParent
If empty parents should be removed from the model after all child cells have been moved out.
mxGraphHandler.prototype.removeEmptyParents
Specifies if drop events are interpreted as new connections if no other drop action is defined.
mxGraphHandler.prototype.connectOnDrop
Specifies if the view should be scrolled so that a moved cell is visible.
mxGraphHandler.prototype.scrollOnMove
Specifies the minimum number of pixels for the width and height of a selection border.
mxGraphHandler.prototype.minimumSize
Specifies the color of the preview shape.
mxGraphHandler.prototype.previewColor
Specifies if the graph container should be used for preview.
mxGraphHandler.prototype.htmlPreview
Reference to the mxShape that represents the preview.
mxGraphHandler.prototype.shape
Specifies if the grid should be scaled.
mxGraphHandler.prototype.scaleGrid
Specifies if the bounding box should allow for rotation.
mxGraphHandler.prototype.rotationEnabled
Returns enabled.
mxGraphHandler.prototype.isEnabled = function()
Sets enabled.
mxGraphHandler.prototype.setEnabled = function( value )
Returns cloneEnabled.
mxGraphHandler.prototype.isCloneEnabled = function()
Sets cloneEnabled.
mxGraphHandler.prototype.setCloneEnabled = function( value )
Returns moveEnabled.
mxGraphHandler.prototype.isMoveEnabled = function()
Sets moveEnabled.
mxGraphHandler.prototype.setMoveEnabled = function( value )
Returns selectEnabled.
mxGraphHandler.prototype.isSelectEnabled = function()
Sets selectEnabled.
mxGraphHandler.prototype.setSelectEnabled = function( value )
Returns removeCellsFromParent.
mxGraphHandler.prototype.isRemoveCellsFromParent = function()
Sets removeCellsFromParent.
mxGraphHandler.prototype.setRemoveCellsFromParent = function( value )
Hook to return initial cell for the given event.
mxGraphHandler.prototype.getInitialCellForEvent = function( me )
Hook to return true for delayed selections.
mxGraphHandler.prototype.isDelayedSelection = function( cell, me )
Consumes the given mouse event.
mxGraphHandler.prototype.consumeMouseEvent = function( evtName, me )
Handles the event by selecing the given cell and creating a handle for it.
mxGraphHandler.prototype.mouseDown = function( sender, me )
Creates an array of cell states which should be used as guides.
mxGraphHandler.prototype.getGuideStates = function()
Returns the cells to be modified by this handler.
mxGraphHandler.prototype.getCells = function( initialCell )
Returns the mxRectangle used as the preview bounds for moving the given cells.
mxGraphHandler.prototype.getPreviewBounds = function( cells )
Returns the union of the mxCellStates for the given array of mxCells.
mxGraphHandler.prototype.getBoundingBox = function( cells )
Creates the shape used to draw the preview for the given bounds.
mxGraphHandler.prototype.createPreviewShape = function( bounds )
Starts the handling of the mouse gesture.
mxGraphHandler.prototype.start = function( cell, x, y )
Returns true if the guides should be used for the given mxMouseEvent.
mxGraphHandler.prototype.useGuidesForEvent = function( me )
Snaps the given vector to the grid and returns the given mxPoint instance.
mxGraphHandler.prototype.snap = function( vector )
Returns an mxPoint that represents the vector for moving the cells for the given mxMouseEvent.
mxGraphHandler.prototype.getDelta = function( me )
Hook for subclassers do show details while the handler is active.
mxGraphHandler.prototype.updateHint = function( me )
Hooks for subclassers to hide details when the handler gets inactive.
mxGraphHandler.prototype.removeHint = function()
Hook for rounding the unscaled vector.
mxGraphHandler.prototype.roundLength = function( length )
Handles the event by highlighting possible drop targets and updating the preview.
mxGraphHandler.prototype.mouseMove = function( sender, me )
Updates the bounds of the preview shape.
mxGraphHandler.prototype.updatePreviewShape = function()
Sets the color of the rectangle used to highlight drop targets.
mxGraphHandler.prototype.setHighlightColor = function( color )
Handles the event by applying the changes to the selection cells.
mxGraphHandler.prototype.mouseUp = function( sender, me )
Implements the delayed selection for the given mouse event.
mxGraphHandler.prototype.selectDelayed = function( me )
Resets the state of this handler.
mxGraphHandler.prototype.reset = function()
Returns true if the given cells should be removed from the parent for the specified mousereleased event.
mxGraphHandler.prototype.shouldRemoveCellsFromParent = function( parent, cells, evt )
Moves the given cells by the specified amount.
mxGraphHandler.prototype.moveCells = function( cells, dx, dy, clone, target, evt )
Destroy the preview and highlight shapes.
mxGraphHandler.prototype.destroyShapes = function()
Destroys the handler and all its resources and DOM nodes.
mxGraphHandler.prototype.destroy = function()
Reference to the enclosing mxGraph.
mxPanningHandler.prototype.graph
Specifies if panning should be active for the left mouse button.
mxPanningHandler.prototype.useLeftButtonForPanning
Specifies if mxEvent.isPopupTrigger should also be used for panning.
mxPanningHandler.prototype.usePopupTrigger
Specifies if panning should be active even if there is a cell under the mousepointer.
mxPanningHandler.prototype.ignoreCell
Specifies if the panning should be previewed.
mxPanningHandler.prototype.previewEnabled
Specifies if the panning steps should be aligned to the grid size.
mxPanningHandler.prototype.useGrid
Specifies if panning should be enabled.
mxPanningHandler.prototype.panningEnabled
Specifies if pinch gestures should be handled as zoom.
mxPanningHandler.prototype.pinchEnabled
Specifies the maximum scale.
mxPanningHandler.prototype.maxScale
Specifies the minimum scale.
mxPanningHandler.prototype.minScale
Holds the current horizontal offset.
mxPanningHandler.prototype.dx
Holds the current vertical offset.
mxPanningHandler.prototype.dy
Holds the x-coordinate of the start point.
mxPanningHandler.prototype.startX
Holds the y-coordinate of the start point.
mxPanningHandler.prototype.startY
Returns true if the handler is currently active.
mxPanningHandler.prototype.isActive = function()
Returns panningEnabled.
mxPanningHandler.prototype.isPanningEnabled = function()
Sets panningEnabled.
mxPanningHandler.prototype.setPanningEnabled = function( value )
Returns pinchEnabled.
mxPanningHandler.prototype.isPinchEnabled = function()
Sets pinchEnabled.
mxPanningHandler.prototype.setPinchEnabled = function( value )
Returns true if the given event is a panning trigger for the optional given cell.
mxPanningHandler.prototype.isPanningTrigger = function( me )
Returns true if the given mxMouseEvent should start panning.
mxPanningHandler.prototype.isForcePanningEvent = function( me )
Handles the event by initiating the panning.
mxPanningHandler.prototype.mouseDown = function( sender, me )
Starts panning at the given event.
mxPanningHandler.prototype.start = function( me )
Consumes the given mxMouseEvent if it was a panning trigger in mouseDown.
mxPanningHandler.prototype.consumePanningTrigger = function( me )
Handles the event by updating the panning on the graph.
mxPanningHandler.prototype.mouseMove = function( sender, me )
Handles the event by setting the translation on the view or showing the popupmenu.
mxPanningHandler.prototype.mouseUp = function( sender, me )
Pans graph by the given amount.
mxPanningHandler.prototype.panGraph = function( dx, dy )
Destroys the handler and all its resources and DOM nodes.
mxPanningHandler.prototype.destroy = function()
Constructs an event handler that creates a mxPopupMenu.
function mxPopupMenuHandler( graph, factoryMethod )
Reference to the enclosing mxGraph.
mxPopupMenuHandler.prototype.graph
Specifies if cells should be selected if a popupmenu is displayed for them.
mxPopupMenuHandler.prototype.selectOnPopup
Specifies if cells should be deselected if a popupmenu is displayed for the diagram background.
mxPopupMenuHandler.prototype.clearSelectionOnBackground
X-coordinate of the mouse down event.
mxPopupMenuHandler.prototype.triggerX
Y-coordinate of the mouse down event.
mxPopupMenuHandler.prototype.triggerY
Screen X-coordinate of the mouse down event.
mxPopupMenuHandler.prototype.screenX
Screen Y-coordinate of the mouse down event.
mxPopupMenuHandler.prototype.screenY
Initializes the shapes required for this vertex handler.
mxPopupMenuHandler.prototype.init = function()
Hook for returning if a cell should be selected for a given mxMouseEvent.
mxPopupMenuHandler.prototype.isSelectOnPopup = function( me )
Handles the event by initiating the panning.
mxPopupMenuHandler.prototype.mouseDown = function( sender, me )
Handles the event by updating the panning on the graph.
mxPopupMenuHandler.prototype.mouseMove = function( sender, me )
Handles the event by setting the translation on the view or showing the popupmenu.
mxPopupMenuHandler.prototype.mouseUp = function( sender, me )
Hook to return the cell for the mouse up popup trigger handling.
mxPopupMenuHandler.prototype.getCellForPopupEvent = function( me )
Destroys the handler and all its resources and DOM nodes.
mxPopupMenuHandler.prototype.destroy = function()
Constructs a new cell marker.
function mxCellMarker( graph, validColor, invalidColor, hotspot )
Reference to the enclosing mxGraph.
mxCellMarker.prototype.graph
Specifies if the marker is enabled.
mxCellMarker.prototype.enabled
Specifies the portion of the width and height that should trigger a highlight.
mxCellMarker.prototype.hotspot
Specifies if the hotspot is enabled.
mxCellMarker.prototype.hotspotEnabled
Holds the valid marker color.
mxCellMarker.prototype.validColor
Holds the invalid marker color.
mxCellMarker.prototype.invalidColor
Holds the current marker color.
mxCellMarker.prototype.currentColor
Holds the marked mxCellState if it is valid.
mxCellMarker.prototype.validState
Holds the marked mxCellState.
mxCellMarker.prototype.markedState
Enables or disables event handling.
mxCellMarker.prototype.setEnabled = function( enabled )
Returns true if events are handled.
mxCellMarker.prototype.isEnabled = function()
Sets the hotspot.
mxCellMarker.prototype.setHotspot = function( hotspot )
Returns the hotspot.
mxCellMarker.prototype.getHotspot = function()
Specifies whether the hotspot should be used in intersects.
mxCellMarker.prototype.setHotspotEnabled = function( enabled )
Returns true if the given coordinate pair intersects the given state.
mxCellMarker.prototype.intersects = function( state, me )
Returns true if hotspot is used in intersects.
mxCellMarker.prototype.isHotspotEnabled = function()
Returns true if validState is not null.
mxCellMarker.prototype.hasValidState = function()
Returns the validState.
mxCellMarker.prototype.getValidState = function()
Returns the markedState.
mxCellMarker.prototype.getMarkedState = function()
Resets the state of the cell marker.
mxCellMarker.prototype.reset = function()
Processes the given event and cell and marks the state returned by getState with the color returned by getMarkerColor.
mxCellMarker.prototype.process = function( me )
Uses getCell, getStateToMark and intersects to return the mxCellState for the given mxMouseEvent.
mxCellMarker.prototype.getState = function( me )
Returns the valid- or invalidColor depending on the value of isValid.
mxCellMarker.prototype.getMarkerColor = function( evt, state, isValid )
Sets and marks the current valid state.
mxCellMarker.prototype.setCurrentState = function( state, me, color )
Marks the given cell using the given color, or validColor if no color is specified.
mxCellMarker.prototype.markCell = function( cell, color )
Marks the markedState and fires a mark event.
mxCellMarker.prototype.mark = function()
Hides the marker and fires a mark event.
mxCellMarker.prototype.unmark = function()
Returns true if the given mxCellState is a valid state.
mxCellMarker.prototype.isValidState = function( state )
Returns the mxCell for the given event and cell.
mxCellMarker.prototype.getCell = function( me )
Returns the mxCellState to be marked for the given mxCellState under the mouse.
mxCellMarker.prototype.getStateToMark = function( state )
Destroys the handler and all its resources and DOM nodes.
mxCellMarker.prototype.destroy = function()
Reference to the enclosing mxGraph.
mxSelectionCellsHandler.prototype.graph
Specifies if events are handled.
mxSelectionCellsHandler.prototype.enabled
Keeps a reference to an event listener for later removal.
mxSelectionCellsHandler.prototype.refreshHandler
Defines the maximum number of handlers to paint individually.
mxSelectionCellsHandler.prototype.maxHandlers
mxDictionary that maps from cells to handlers.
mxSelectionCellsHandler.prototype.handlers
Returns enabled.
mxSelectionCellsHandler.prototype.isEnabled = function()
Sets enabled.
mxSelectionCellsHandler.prototype.setEnabled = function( value )
Returns the handler for the given cell.
mxSelectionCellsHandler.prototype.getHandler = function( cell )
Resets all handlers.
mxSelectionCellsHandler.prototype.reset = function()
Reloads or updates all handlers.
mxSelectionCellsHandler.prototype.refresh = function()
Returns true if the given handler is active and should not be redrawn.
mxSelectionCellsHandler.prototype.isHandlerActive = function( handler )
Updates the handler for the given shape if one exists.
mxSelectionCellsHandler.prototype.updateHandler = function( state )
Redirects the given event to the handlers.
mxSelectionCellsHandler.prototype.mouseDown = function( sender, me )
Redirects the given event to the handlers.
mxSelectionCellsHandler.prototype.mouseMove = function( sender, me )
Redirects the given event to the handlers.
mxSelectionCellsHandler.prototype.mouseUp = function( sender, me )
Destroys the handler and all its resources and DOM nodes.
mxSelectionCellsHandler.prototype.destroy = function()
Connects the given source and target using a new edge.
mxConnectionHandler.prototype.connect = function( source, target, evt, dropTarget )
Resets the state of this handler.
mxConnectionHandler.prototype.reset = function()
Constructs an event handler that connects vertices using the specified factory method to create the new edges.
function mxConnectionHandler( graph, factoryMethod )
Reference to the enclosing mxGraph.
mxConnectionHandler.prototype.graph
Function that is used for creating new edges.
mxConnectionHandler.prototype.factoryMethod
Specifies if icons should be displayed inside the graph container instead of the overlay pane.
mxConnectionHandler.prototype.moveIconFront
Specifies if icons should be moved to the back of the overlay pane.
mxConnectionHandler.prototype.moveIconBack
mxImage that is used to trigger the creation of a new connection.
mxConnectionHandler.prototype.connectImage
Specifies if the connect icon should be centered on the target state while connections are being previewed.
mxConnectionHandler.prototype.targetConnectImage
Specifies if events are handled.
mxConnectionHandler.prototype.enabled
Specifies if new edges should be selected.
mxConnectionHandler.prototype.select
Specifies if createTargetVertex should be called if no target was under the mouse for the new connection.
mxConnectionHandler.prototype.createTarget
Hook method for creating new vertices on the fly if no target was under the mouse.
mxConnectionHandler.prototype.createTargetVertex = function( evt, source )
Holds the mxTerminalMarker used for finding source and target cells.
mxConnectionHandler.prototype.marker
Holds the mxConstraintHandler used for drawing and highlighting constraints.
mxConnectionHandler.prototype.constraintHandler
Holds the current validation error while connections are being created.
mxConnectionHandler.prototype.error
Specifies if single clicks should add waypoints on the new edge.
mxConnectionHandler.prototype.waypointsEnabled
Specifies if the connection handler should ignore the state of the mouse button when highlighting the source.
mxConnectionHandler.prototype.ignoreMouseDown
Holds the mxPoint where the mouseDown took place while the handler is active.
mxConnectionHandler.prototype.first
Holds the offset for connect icons during connection preview.
mxConnectionHandler.prototype.connectIconOffset
Optional mxCellState that represents the preview edge while the handler is active.
mxConnectionHandler.prototype.edgeState
Holds the change event listener for later removal.
mxConnectionHandler.prototype.changeHandler
Holds the drill event listener for later removal.
mxConnectionHandler.prototype.drillHandler
Counts the number of mouseDown events since the start.
mxConnectionHandler.prototype.mouseDownCounter
Switch to enable moving the preview away from the mousepointer.
mxConnectionHandler.prototype.movePreviewAway
Specifies if connections to the outline of a highlighted target should be enabled.
mxConnectionHandler.prototype.outlineConnect
Specifies if the actual shape of the edge state should be used for the preview.
mxConnectionHandler.prototype.livePreview
Specifies the cursor to be used while the handler is active.
mxConnectionHandler.prototype.cursor
Specifies if new edges should be inserted before the source vertex in the cell hierarchy.
mxConnectionHandler.prototype.insertBeforeSource
Returns true if events are handled.
mxConnectionHandler.prototype.isEnabled = function()
Enables or disables event handling.
mxConnectionHandler.prototype.setEnabled = function( enabled )
Returns insertBeforeSource for non-loops and false for loops.
mxConnectionHandler.prototype.isInsertBefore = function( edge, source, target, evt, dropTarget )
Returns createTarget.
mxConnectionHandler.prototype.isCreateTarget = function( evt )
Sets createTarget.
mxConnectionHandler.prototype.setCreateTarget = function( value )
Creates the preview shape for new connections.
mxConnectionHandler.prototype.createShape = function()
Initializes the shapes required for this connection handler.
mxConnectionHandler.prototype.init = function()
Returns true if the given cell is connectable.
mxConnectionHandler.prototype.isConnectableCell = function( cell )
Creates and returns the mxCellMarker used in marker.
mxConnectionHandler.prototype.createMarker = function()
Starts a new connection for the given state and coordinates.
mxConnectionHandler.prototype.start = function( state, x, y, edgeState )
Returns true if the source terminal has been clicked and a new connection is currently being previewed.
mxConnectionHandler.prototype.isConnecting = function()
Returns mxGraph.isValidSource for the given source terminal.
mxConnectionHandler.prototype.isValidSource = function( cell, me )
Returns true.
mxConnectionHandler.prototype.isValidTarget = function( cell )
Returns the error message or an empty string if the connection for the given source target pair is not valid.
mxConnectionHandler.prototype.validateConnection = function( source, target )
Hook to return the mxImage used for the connection icon of the given mxCellState.
mxConnectionHandler.prototype.getConnectImage = function( state )
Returns true if the state has a HTML label in the graph’s container, otherwise it returns moveIconFront.
mxConnectionHandler.prototype.isMoveIconToFrontForState = function( state )
Creates the array mxImageShapes that represent the connect icons for the given mxCellState.
mxConnectionHandler.prototype.createIcons = function( state )
Redraws the given array of mxImageShapes.
mxConnectionHandler.prototype.redrawIcons = function( icons, state )
Destroys the connect icons and resets the respective state.
mxConnectionHandler.prototype.destroyIcons = function()
Returns true if the given mouse down event should start this handler.
mxConnectionHandler.prototype.isStartEvent = function( me )
Handles the event by initiating a new connection.
mxConnectionHandler.prototype.mouseDown = function( sender, me )
Returns true if a tap on the given source state should immediately start connecting.
mxConnectionHandler.prototype.isImmediateConnectSource = function( state )
Hook to return an mxCellState which may be used during the preview.
mxConnectionHandler.prototype.createEdgeState = function( me )
Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed.
mxConnectionHandler.prototype.isOutlineConnectEvent = function( me )
Updates the current state for a given mouse move event by using the marker.
mxConnectionHandler.prototype.updateCurrentState = function( me, point )
Returns true if the given cell does not allow new connections to be created.
mxConnectionHandler.prototype.isCellEnabled = function( cell )
Converts the given point from screen coordinates to model coordinates.
mxConnectionHandler.prototype.convertWaypoint = function( point )
Called to snap the given point to the current preview.
mxConnectionHandler.prototype.snapToPreview = function( me, point )
Handles the event by updating the preview edge or by highlighting a possible source or target terminal.
mxConnectionHandler.prototype.mouseMove = function( sender, me )
Updates edgeState.
mxConnectionHandler.prototype.updateEdgeState = function( current, constraint )
Returns the perimeter point for the given target state.
mxConnectionHandler.prototype.getTargetPerimeterPoint = function( state, me )
Hook to update the icon position(s) based on a mouseOver event.
mxConnectionHandler.prototype.getSourcePerimeterPoint = function( state, next, me )
Hook to update the icon position(s) based on a mouseOver event.
mxConnectionHandler.prototype.updateIcons = function( state, icons, me )
Returns true if the given mouse up event should stop this handler.
mxConnectionHandler.prototype.isStopEvent = function( me )
Adds the waypoint for the given event to waypoints.
mxConnectionHandler.prototype.addWaypointForEvent = function( me )
Returns true if the connection for the given constraints is valid.
mxConnectionHandler.prototype.checkConstraints = function( c1, c2 )
Handles the event by inserting the new connection.
mxConnectionHandler.prototype.mouseUp = function( sender, me )
Redraws the preview edge using the color and width returned by getEdgeColor and getEdgeWidth.
mxConnectionHandler.prototype.drawPreview = function()
Returns the width used to draw the preview edge.
mxConnectionHandler.prototype.getEdgeWidth = function( valid )
Selects the given edge after adding a new connection.
mxConnectionHandler.prototype.selectCells = function( edge, target )
Creates, inserts and returns the new edge for the given parameters.
mxConnectionHandler.prototype.insertEdge = function( parent, id, value, source, target, style )
Returns the tolerance for aligning new targets to sources.
mxConnectionHandler.prototype.getAlignmentTolerance = function( evt )
Creates and returns a new edge using factoryMethod if one exists.
mxConnectionHandler.prototype.createEdge = function( value, source, target, style )
Destroys the handler and all its resources and DOM nodes.
mxConnectionHandler.prototype.destroy = function()
Constructs an new constraint handler.
function mxConstraintHandler( graph )
mxImage to be used as the image for fixed connection points.
mxConstraintHandler.prototype.pointImage
Reference to the enclosing mxGraph.
mxConstraintHandler.prototype.graph
Specifies if events are handled.
mxConstraintHandler.prototype.enabled
Specifies the color for the highlight.
mxConstraintHandler.prototype.highlightColor
Returns true if events are handled.
mxConstraintHandler.prototype.isEnabled = function()
Enables or disables event handling.
mxConstraintHandler.prototype.setEnabled = function( enabled )
Resets the state of this handler.
mxConstraintHandler.prototype.reset = function()
Returns the tolerance to be used for intersecting connection points.
mxConstraintHandler.prototype.getTolerance = function( me )
Returns the tolerance to be used for intersecting connection points.
mxConstraintHandler.prototype.getImageForConstraint = function( state, constraint, point )
Returns true if the given mxMouseEvent should be ignored in update.
mxConstraintHandler.prototype.isEventIgnored = function( me, source )
Updates the state of this handler based on the given mxMouseEvent.
mxConstraintHandler.prototype.update = function( me, source, existingEdge, point )
Returns true if the given state should be ignored.
mxConstraintHandler.prototype.isStateIgnored = function( state, source )
Destroys the focusIcons if they exist.
mxConstraintHandler.prototype.destroyIcons = function()
Destroys the focusHighlight if one exists.
mxConstraintHandler.prototype.destroyFocusHighlight = function()
Returns true if the current focused state should not be changed for the given event.
mxConstraintHandler.prototype.isKeepFocusEvent = function( me )
Returns the cell for the given event.
mxConstraintHandler.prototype.getCellForEvent = function( me, point )
Transfers the focus to the given state as a source or target terminal.
mxConstraintHandler.prototype.redraw = function()
Transfers the focus to the given state as a source or target terminal.
mxConstraintHandler.prototype.setFocus = function( me, state, source )
Create the shape used to paint the highlight.
mxConstraintHandler.prototype.createHighlightShape = function()
Returns true if the given icon intersects the given rectangle.
mxConstraintHandler.prototype.intersects = function( icon, mouse, source, existingEdge )
Destroy this handler.
mxConstraintHandler.prototype.destroy = function()
Constructs an event handler that selects rectangular regions in the graph using rubberband selection.
function mxRubberband( graph )
Specifies the default opacity to be used for the rubberband div.
mxRubberband.prototype.defaultOpacity
Specifies if events are handled.
mxRubberband.prototype.enabled
Holds the DIV element which is currently visible.
mxRubberband.prototype.div
Holds the DIV element which is used to display the rubberband.
mxRubberband.prototype.sharedDiv
Holds the value of the x argument in the last call to update.
mxRubberband.prototype.currentX
Sets currentX and currentY and calls repaint.
mxRubberband.prototype.update = function( x, y )
Holds the value of the y argument in the last call to update.
mxRubberband.prototype.currentY
Optional fade out effect.
mxRubberband.prototype.fadeOut
Returns true if events are handled.
mxRubberband.prototype.isEnabled = function()
Enables or disables event handling.
mxRubberband.prototype.setEnabled = function( enabled )
Returns true if the given mxMouseEvent should start rubberband selection.
mxRubberband.prototype.isForceRubberbandEvent = function( me )
Handles the event by initiating a rubberband selection.
mxRubberband.prototype.mouseDown = function( sender, me )
Sets the start point for the rubberband selection.
mxRubberband.prototype.start = function( x, y )
Handles the event by updating therubberband selection.
mxRubberband.prototype.mouseMove = function( sender, me )
Creates the rubberband selection shape.
mxRubberband.prototype.createShape = function()
Returns true if this handler is active.
mxRubberband.prototype.isActive = function( sender, me )
Handles the event by selecting the region of the rubberband using mxGraph.selectRegion.
mxRubberband.prototype.mouseUp = function( sender, me )
Resets the state of this handler and selects the current region for the given event.
mxRubberband.prototype.execute = function( evt )
Resets the state of the rubberband selection.
mxRubberband.prototype.reset = function()
Computes the bounding box and updates the style of the div.
mxRubberband.prototype.repaint = function()
Destroys the handler and all its resources and DOM nodes.
mxRubberband.prototype.destroy = function()
Constructs a new handle for the given state.
function mxHandle( state, cursor, image )
Specifies the cursor to be used for this handle.
mxHandle.prototype.cursor
Specifies the mxImage to be used to render the handle.
mxHandle.prototype.image
Hook for subclassers to return the current position of the handle.
mxHandle.prototype.getPosition = function( bounds )
Hooks for subclassers to update the style in the state.
mxHandle.prototype.setPosition = function( bounds, pt, me )
Hook for subclassers to execute the handle.
mxHandle.prototype.execute = function()
Sets the cell style with the given name to the corresponding value in state.
mxHandle.prototype.copyStyle = function( key )
Processes the given mxMouseEvent and invokes setPosition.
mxHandle.prototype.processEvent = function( me )
Called after setPosition has been called in processEvent.
mxHandle.prototype.positionChanged = function()
Returns the rotation defined in the style of the cell.
mxHandle.prototype.getRotation = function()
Returns the rotation from the style and the rotation from the direction of the cell.
mxHandle.prototype.getTotalRotation = function()
Creates and initializes the shapes required for this handle.
mxHandle.prototype.init = function()
Creates and returns the shape for this handle.
mxHandle.prototype.createShape = function( html )
Initializes shape and sets its cursor.
mxHandle.prototype.initShape = function( html )
Renders the shape for this handle.
mxHandle.prototype.redraw = function()
Returns true if this handle should be rendered in HTML.
mxHandle.prototype.isHtmlRequired = function()
Rotates the point by the given angle.
mxHandle.prototype.rotatePoint = function( pt, alpha )
Flips the given point vertically and/or horizontally.
mxHandle.prototype.flipPoint = function( pt )
Snaps the given point to the grid if ignore is false.
mxHandle.prototype.snapPoint = function( pt, ignore )
Shows or hides this handle.
mxHandle.prototype.setVisible = function( visible )
Resets the state of this handle by setting its visibility to true.
mxHandle.prototype.reset = function()
Destroys this handle.
mxHandle.prototype.destroy = function()
Constructs an event handler that allows to resize vertices and groups.
function mxVertexHandler( state )
Reference to the enclosing mxGraph.
mxVertexHandler.prototype.graph
Reference to the mxCellState being modified.
mxVertexHandler.prototype.state
Specifies if only one sizer handle at the bottom, right corner should be used.
mxVertexHandler.prototype.singleSizer
Holds the index of the current handle.
mxVertexHandler.prototype.index
Specifies if the bounds of handles should be used for hit-detection in IE or if tolerance > 0.
mxVertexHandler.prototype.allowHandleBoundsCheck
Optional tolerance for hit-detection in getHandleForEvent.
mxVertexHandler.prototype.tolerance
Optional mxImage to be used as handles.
mxVertexHandler.prototype.handleImage
Returns the index of the handle for the given event.
mxVertexHandler.prototype.getHandleForEvent = function( me )
Specifies if a rotation handle should be visible.
mxVertexHandler.prototype.rotationEnabled
Specifies if the parent should be highlighted if a child cell is selected.
mxVertexHandler.prototype.parentHighlightEnabled
Specifies if rotation steps should be “rasterized” depening on the distance to the handle.
mxVertexHandler.prototype.rotationRaster
Specifies the cursor for the rotation handle.
mxVertexHandler.prototype.rotationCursor
Specifies if resize should change the cell in-place.
mxVertexHandler.prototype.livePreview
Specifies if sizers should be hidden and spaced if the vertex is small.
mxVertexHandler.prototype.manageSizers
Specifies if the size of groups should be constrained by the children.
mxVertexHandler.prototype.constrainGroupByChildren
Vertical spacing for rotation icon.
mxVertexHandler.prototype.rotationHandleVSpacing
The horizontal offset for the handles.
mxVertexHandler.prototype.horizontalOffset
The horizontal offset for the handles.
mxVertexHandler.prototype.verticalOffset
Initializes the shapes required for this vertex handler.
mxVertexHandler.prototype.init = function()
Returns true if the rotation handle should be showing.
mxVertexHandler.prototype.isRotationHandleVisible = function()
Returns true if the aspect ratio if the cell should be maintained.
mxVertexHandler.prototype.isConstrainedEvent = function( me )
Returns true if the center of the vertex should be maintained during the resize.
mxVertexHandler.prototype.isCenteredEvent = function( state, me )
Returns an array of custom handles.
mxVertexHandler.prototype.createCustomHandles = function()
Initializes the shapes required for this vertex handler.
mxVertexHandler.prototype.updateMinBounds = function()
Returns the mxRectangle that defines the bounds of the selection border.
mxVertexHandler.prototype.getSelectionBounds = function( state )
Creates the shape used to draw the selection border.
mxVertexHandler.prototype.createParentHighlightShape = function( bounds )
Creates the shape used to draw the selection border.
mxVertexHandler.prototype.createSelectionShape = function( bounds )
Returns mxConstants.VERTEX_SELECTION_COLOR.
mxVertexHandler.prototype.getSelectionColor = function()
Returns mxConstants.VERTEX_SELECTION_STROKEWIDTH.
mxVertexHandler.prototype.getSelectionStrokeWidth = function()
Returns mxConstants.VERTEX_SELECTION_DASHED.
mxVertexHandler.prototype.isSelectionDashed = function()
Creates a sizer handle for the specified cursor and index and returns the new mxRectangleShape that represents the handle.
mxVertexHandler.prototype.createSizer = function( cursor, index, size, fillColor )
Returns true if the sizer for the given index is visible.
mxVertexHandler.prototype.isSizerVisible = function( index )
Creates the shape used for the sizer handle for the specified bounds an index.
mxVertexHandler.prototype.createSizerShape = function( bounds, index, fillColor )
Returns true if the given event allows custom handles to be changed.
mxVertexHandler.prototype.isCustomHandleEvent = function( me )
Handles the event if a handle has been clicked.
mxVertexHandler.prototype.mouseDown = function( sender, me )
Called if livePreview is enabled to check if a border should be painted.
mxVertexHandler.prototype.isLivePreviewBorder = function()
Starts the handling of the mouse gesture.
mxVertexHandler.prototype.start = function( x, y, index )
Hides all sizers except.
mxVertexHandler.prototype.hideSizers = function()
Checks if the coordinates for the given event are within the mxGraph.tolerance.
mxVertexHandler.prototype.checkTolerance = function( me )
Hook for subclassers do show details while the handler is active.
mxVertexHandler.prototype.updateHint = function( me )
Hooks for subclassers to hide details when the handler gets inactive.
mxVertexHandler.prototype.removeHint = function()
Hook for rounding the angle.
mxVertexHandler.prototype.roundAngle = function( angle )
Hook for rounding the unscaled width or height.
mxVertexHandler.prototype.roundLength = function( length )
Handles the event by updating the preview.
mxVertexHandler.prototype.mouseMove = function( sender, me )
Rotates the vertex.
mxVertexHandler.prototype.rotateVertex = function( me )
Repaints the live preview.
mxVertexHandler.prototype.updateLivePreview = function( me )
Handles the event by applying the changes to the geometry.
mxVertexHandler.prototype.mouseUp = function( sender, me )
Hook for subclassers to implement a single click on the rotation handle.
mxVertexHandler.prototype.rotateClick = function()
Rotates the given cell and its children by the given angle in degrees.
mxVertexHandler.prototype.rotateCell = function( cell, angle, parent )
Resets the state of this handler.
mxVertexHandler.prototype.reset = function()
Uses the given vector to change the bounds of the given cell in the graph using mxGraph.resizeCell.
mxVertexHandler.prototype.resizeCell = function( cell, dx, dy, index, gridEnabled, constrained, recurse )
Moves the children of the given cell by the given vector.
mxVertexHandler.prototype.moveChildren = function( cell, dx, dy )
Returns the union of the given bounds and location for the specified handle index.
mxVertexHandler.prototype.union = function( bounds, dx, dy, index, gridEnabled, scale, tr, constrained, centered )
Redraws the handles and the preview.
mxVertexHandler.prototype.redraw = function()
Redraws the handles.
mxVertexHandler.prototype.redrawHandles = function()
Returns an mxPoint that defines the rotation handle position.
mxVertexHandler.prototype.getRotationHandlePosition = function()
Updates the highlight of the parent if parentHighlightEnabled is true.
mxVertexHandler.prototype.updateParentHighlight = function()
Redraws the preview.
mxVertexHandler.prototype.drawPreview = function()
Destroys the handler and all its resources and DOM nodes.
mxVertexHandler.prototype.destroy = function()
Constructs an edge handler for the specified mxCellState.
function mxEdgeHandler( state )
Reference to the enclosing mxGraph.
mxEdgeHandler.prototype.graph
Reference to the mxCellState being modified.
mxEdgeHandler.prototype.state
Holds the mxTerminalMarker which is used for highlighting terminals.
mxEdgeHandler.prototype.marker
Holds the mxConstraintHandler used for drawing and highlighting constraints.
mxEdgeHandler.prototype.constraintHandler
Holds the current validation error while a connection is being changed.
mxEdgeHandler.prototype.error
Holds the mxShape that represents the preview edge.
mxEdgeHandler.prototype.shape
Holds the mxShapes that represent the points.
mxEdgeHandler.prototype.bends
Holds the mxShape that represents the label position.
mxEdgeHandler.prototype.labelShape
Specifies if cloning by control-drag is enabled.
mxEdgeHandler.prototype.cloneEnabled
Specifies if adding bends by shift-click is enabled.
mxEdgeHandler.prototype.addEnabled
Specifies if removing bends by shift-click is enabled.
mxEdgeHandler.prototype.removeEnabled
Specifies if removing bends by double click is enabled.
mxEdgeHandler.prototype.dblClickRemoveEnabled
Specifies if removing bends by dropping them on other bends is enabled.
mxEdgeHandler.prototype.mergeRemoveEnabled
Specifies if removing bends by creating straight segments should be enabled.
mxEdgeHandler.prototype.straightRemoveEnabled
Specifies if virtual bends should be added in the center of each segments.
mxEdgeHandler.prototype.virtualBendsEnabled
Opacity to be used for virtual bends (see virtualBendsEnabled).
mxEdgeHandler.prototype.virtualBendOpacity
Specifies if the parent should be highlighted if a child cell is selected.
mxEdgeHandler.prototype.parentHighlightEnabled
Specifies if bends should be added to the graph container.
mxEdgeHandler.prototype.preferHtml
Specifies if the bounds of handles should be used for hit-detection in IE Default is true.
mxEdgeHandler.prototype.allowHandleBoundsCheck
Specifies if waypoints should snap to the routing centers of terminals.
mxEdgeHandler.prototype.snapToTerminals
Optional mxImage to be used as handles.
mxEdgeHandler.prototype.handleImage
Optional tolerance for hit-detection in getHandleForEvent.
mxEdgeHandler.prototype.tolerance
Returns the index of the handle for the given event.
mxEdgeHandler.prototype.getHandleForEvent = function( me )
Specifies if connections to the outline of a highlighted target should be enabled.
mxEdgeHandler.prototype.outlineConnect
Specifies if the label handle should be moved if it intersects with another handle.
mxEdgeHandler.prototype.manageLabelHandle
Initializes the shapes required for this edge handler.
mxEdgeHandler.prototype.init = function()
Returns an array of custom handles.
mxEdgeHandler.prototype.createCustomHandles = function()
Returns true if virtual bends should be added.
mxEdgeHandler.prototype.isVirtualBendsEnabled = function( evt )
Returns true if the given event is a trigger to add a new point.
mxEdgeHandler.prototype.isAddPointEvent = function( evt )
Returns true if the given event is a trigger to remove a point.
mxEdgeHandler.prototype.isRemovePointEvent = function( evt )
Returns the list of points that defines the selection stroke.
mxEdgeHandler.prototype.getSelectionPoints = function( state )
Creates the shape used to draw the selection border.
mxEdgeHandler.prototype.createSelectionShape = function( points )
Returns mxConstants.EDGE_SELECTION_COLOR.
mxEdgeHandler.prototype.getSelectionColor = function()
Returns mxConstants.EDGE_SELECTION_STROKEWIDTH.
mxEdgeHandler.prototype.getSelectionStrokeWidth = function()
Returns mxConstants.EDGE_SELECTION_DASHED.
mxEdgeHandler.prototype.isSelectionDashed = function()
Returns true if the given cell is connectable.
mxEdgeHandler.prototype.isConnectableCell = function( cell )
Creates and returns the mxCellMarker used in marker.
mxEdgeHandler.prototype.getCellAt = function( x, y )
Creates and returns the mxCellMarker used in marker.
mxEdgeHandler.prototype.createMarker = function()
Returns the error message or an empty string if the connection for the given source, target pair is not valid.
mxEdgeHandler.prototype.validateConnection = function( source, target )
Creates and returns the bends used for modifying the edge.
mxEdgeHandler.prototype.createBends = function()
Creates and returns the bends used for modifying the edge.
mxEdgeHandler.prototype.createVirtualBends = function()
Creates the shape used to display the given bend.
mxEdgeHandler.prototype.isHandleEnabled = function( index )
Returns true if the handle at the given index is visible.
mxEdgeHandler.prototype.isHandleVisible = function( index )
Creates the shape used to display the given bend.
mxEdgeHandler.prototype.createHandleShape = function( index )
Creates the shape used to display the the label handle.
mxEdgeHandler.prototype.createLabelHandleShape = function()
Helper method to initialize the given bend.
mxEdgeHandler.prototype.initBend = function( bend, dblClick )
Returns true if the given event allows virtual bends to be added.
mxEdgeHandler.prototype.isAddVirtualBendEvent = function( me )
Returns true if the given event allows custom handles to be changed.
mxEdgeHandler.prototype.isCustomHandleEvent = function( me )
Handles the event by checking if a special element of the handler was clicked, in which case the index parameter is non-null.
mxEdgeHandler.prototype.mouseDown = function( sender, me )
Starts the handling of the mouse gesture.
mxEdgeHandler.prototype.start = function( x, y, index )
Returns a clone of the current preview state for the given point and terminal.
mxEdgeHandler.prototype.clonePreviewState = function( point, terminal )
Returns the tolerance for the guides.
mxEdgeHandler.prototype.getSnapToTerminalTolerance = function()
Hook for subclassers do show details while the handler is active.
mxEdgeHandler.prototype.updateHint = function( me, point )
Hooks for subclassers to hide details when the handler gets inactive.
mxEdgeHandler.prototype.removeHint = function()
Hook for rounding the unscaled width or height.
mxEdgeHandler.prototype.roundLength = function( length )
Returns true if snapToTerminals is true and if alt is not pressed.
mxEdgeHandler.prototype.isSnapToTerminalsEvent = function( me )
Returns the point for the given event.
mxEdgeHandler.prototype.getPointForEvent = function( me )
Updates the given preview state taking into account the state of the constraint handler.
mxEdgeHandler.prototype.getPreviewTerminalState = function( me )
Updates the given preview state taking into account the state of the constraint handler.
mxEdgeHandler.prototype.getPreviewPoints = function( pt, me )
Returns true if outlineConnect is true and the source of the event is the outline shape or shift is pressed.
mxEdgeHandler.prototype.isOutlineConnectEvent = function( me )
Updates the given preview state taking into account the state of the constraint handler.
mxEdgeHandler.prototype.updatePreviewState = function( edge, point, terminalState, me, outline )
Handles the event by updating the preview.
mxEdgeHandler.prototype.mouseMove = function( sender, me )
Handles the event to applying the previewed changes on the edge by using moveLabel, connect or changePoints.
mxEdgeHandler.prototype.mouseUp = function( sender, me )
Changes the coordinates for the label of the given edge.
mxEdgeHandler.prototype.moveLabel = function( edgeState, x, y )
Changes the terminal or terminal point of the given edge in the graph model.
mxEdgeHandler.prototype.connect = function( edge, terminal, isSource, isClone, me )
Changes the control points of the given edge in the graph model.
mxEdgeHandler.prototype.changePoints = function( edge, points, clone )
Resets the state of this handler.
mxEdgeHandler.prototype.reset = function()
Sets the color of the preview to the given value.
mxEdgeHandler.prototype.setPreviewColor = function( color )
Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid.
mxEdgeHandler.prototype.convertPoint = function( point, gridEnabled )
Changes the terminal point of the given edge.
mxEdgeHandler.prototype.changeTerminalPoint = function( edge, point, isSource, clone )
Adds a control point for the given state and event.
mxEdgeHandler.prototype.addPoint = function( state, evt )
Adds a control point at the given point.
mxEdgeHandler.prototype.addPointAt = function( state, x, y )
Removes the control point at the given index from the given state.
mxEdgeHandler.prototype.removePoint = function( state, index )
Returns the fillcolor for the handle at the given index.
mxEdgeHandler.prototype.getHandleFillColor = function( index )
Redraws the preview, and the bends- and label control points.
mxEdgeHandler.prototype.redraw = function()
Redraws the handles.
mxEdgeHandler.prototype.redrawHandles = function()
Updates and redraws the inner bends.
mxEdgeHandler.prototype.redrawInnerBends = function( p0, pe )
Checks if the label handle intersects the given bounds and moves it if it intersects.
mxEdgeHandler.prototype.checkLabelHandle = function( b )
Redraws the preview.
mxEdgeHandler.prototype.drawPreview = function()
Refreshes the bends of this handler.
mxEdgeHandler.prototype.refresh = function()
Destroys all elements in bends.
mxEdgeHandler.prototype.destroyBends = function( bends )
Destroys the handler and all its resources and DOM nodes.
mxEdgeHandler.prototype.destroy = function()
Specifies the resource key for the tooltip to be displayed on the single control point for routed edges.
mxElbowEdgeHandler.prototype.doubleClickOrientationResource
Overrides mxEdgeHandler.createBends to create custom bends.
mxElbowEdgeHandler.prototype.createBends = function()
Creates a virtual bend that supports double clicking and calls mxGraph.flipEdge.
mxElbowEdgeHandler.prototype.createVirtualBend = function( dblClickHandler )
Returns the cursor to be used for the bend.
mxElbowEdgeHandler.prototype.getCursorForBend = function()
Returns the tooltip for the given node.
mxElbowEdgeHandler.prototype.getTooltipForNode = function( node )
Converts the given point in-place from screen to unscaled, untranslated graph coordinates and applies the grid.
mxElbowEdgeHandler.prototype.convertPoint = function( point, gridEnabled )
Updates and redraws the inner bends.
mxElbowEdgeHandler.prototype.redrawInnerBends = function( p0, pe )
Returns the current absolute points.
mxEdgeSegmentHandler.prototype.getCurrentPoints = function()
Updates the given preview state taking into account the state of the constraint handler.
mxEdgeSegmentHandler.prototype.getPreviewPoints = function( point )
Overridden to perform optimization of the edge style result.
mxEdgeSegmentHandler.prototype.updatePreviewState = function( edge, point, terminalState, me )
Overridden to invoke refresh before the redraw.
mxEdgeSegmentHandler.prototype.redraw = function()
Constructs an event handler that executes functions bound to specific keystrokes.
function mxKeyHandler( graph, target )
Reference to the mxGraph associated with this handler.
mxKeyHandler.prototype.graph
Reference to the target DOM, that is, the DOM node where the key event listeners are installed.
mxKeyHandler.prototype.target
Maps from keycodes to functions for non-pressed control keys.
mxKeyHandler.prototype.normalKeys
Maps from keycodes to functions for pressed shift keys.
mxKeyHandler.prototype.shiftKeys
Maps from keycodes to functions for pressed control keys.
mxKeyHandler.prototype.controlKeys
Maps from keycodes to functions for pressed control and shift keys.
mxKeyHandler.prototype.controlShiftKeys
Specifies if events are handled.
mxKeyHandler.prototype.enabled
Returns true if events are handled.
mxKeyHandler.prototype.isEnabled = function()
Enables or disables event handling by updating enabled.
mxKeyHandler.prototype.setEnabled = function( enabled )
Binds the specified keycode to the given function.
mxKeyHandler.prototype.bindKey = function( code, funct )
Binds the specified keycode to the given function.
mxKeyHandler.prototype.bindShiftKey = function( code, funct )
Binds the specified keycode to the given function.
mxKeyHandler.prototype.bindControlKey = function( code, funct )
Binds the specified keycode to the given function.
mxKeyHandler.prototype.bindControlShiftKey = function( code, funct )
Returns true if the control key is pressed.
mxKeyHandler.prototype.isControlDown = function( evt )
Returns the function associated with the given key event or null if no function is associated with the given event.
mxKeyHandler.prototype.getFunction = function( evt )
Returns true if the event should be processed by this handler, that is, if the event source is either the target, one of its direct children, a descendant of the mxGraph.container, or the mxGraph.cellEditor of the graph.
mxKeyHandler.prototype.isGraphEvent = function( evt )
Handles the event by invoking the function bound to the respective keystroke if isEnabledForEvent returns true for the given event and if isEventIgnored returns false, except for escape for which isEventIgnored is not invoked.
mxKeyHandler.prototype.keyDown = function( evt )
Returns true if the given event should be handled.
mxKeyHandler.prototype.isEnabledForEvent = function( evt )
Returns true if the given keystroke should be ignored.
mxKeyHandler.prototype.isEventIgnored = function( evt )
Hook to process ESCAPE keystrokes.
mxKeyHandler.prototype.escape = function( evt )
Destroys the handler and all its references into the DOM.
mxKeyHandler.prototype.destroy = function()
Constructs an event handler that displays tooltips with the specified delay (in milliseconds).
function mxTooltipHandler( graph, delay )
Specifies the zIndex for the tooltip and its shadow.
mxTooltipHandler.prototype.zIndex
Reference to the enclosing mxGraph.
mxTooltipHandler.prototype.graph
Delay to show the tooltip in milliseconds.
mxTooltipHandler.prototype.delay
Specifies if touch and pen events should be ignored.
mxTooltipHandler.prototype.ignoreTouchEvents
Specifies if the tooltip should be hidden if the mouse is moved over the current cell.
mxTooltipHandler.prototype.hideOnHover
True if this handler was destroyed using destroy.
mxTooltipHandler.prototype.destroyed
Destroys the handler and all its resources and DOM nodes.
mxTooltipHandler.prototype.destroy = function()
Specifies if events are handled.
mxTooltipHandler.prototype.enabled
Returns true if events are handled.
mxTooltipHandler.prototype.isEnabled = function()
Enables or disables event handling.
mxTooltipHandler.prototype.setEnabled = function( enabled )
Returns hideOnHover.
mxTooltipHandler.prototype.isHideOnHover = function()
Sets hideOnHover.
mxTooltipHandler.prototype.setHideOnHover = function( value )
Initializes the DOM nodes required for this tooltip handler.
mxTooltipHandler.prototype.init = function()
Returns the mxCellState to be used for showing a tooltip for this event.
mxTooltipHandler.prototype.getStateForEvent = function( me )
Handles the event by initiating a rubberband selection.
mxTooltipHandler.prototype.mouseDown = function( sender, me )
Handles the event by updating the rubberband selection.
mxTooltipHandler.prototype.mouseMove = function( sender, me )
Handles the event by resetting the tooltip timer or hiding the existing tooltip.
mxTooltipHandler.prototype.mouseUp = function( sender, me )
Resets the timer.
mxTooltipHandler.prototype.resetTimer = function()
Resets and/or restarts the timer to trigger the display of the tooltip.
mxTooltipHandler.prototype.reset = function( me, restart, state )
Hides the tooltip and resets the timer.
mxTooltipHandler.prototype.hide = function()
Hides the tooltip.
mxTooltipHandler.prototype.hideTooltip = function()
Shows the tooltip for the specified cell and optional index at the specified location (with a vertical offset of 10 pixels).
mxTooltipHandler.prototype.show = function( tip, x, y )
Constructs an event handler that highlights cells.
function mxCellTracker( graph, color, funct )
Ignores the event.
mxCellTracker.prototype.mouseDown = function( sender, me )
Handles the event by highlighting the cell under the mousepointer if it is over the hotspot region of the cell.
mxCellTracker.prototype.mouseMove = function( sender, me )
Handles the event by reseting the highlight.
mxCellTracker.prototype.mouseUp = function( sender, me )
Destroys the object and all its resources and DOM nodes.
mxCellTracker.prototype.destroy = function()
Constructs a cell highlight.
function mxCellHighlight( graph, highlightColor, strokeWidth, dashed )
Specifies if the highlights should appear on top of everything else in the overlay pane.
mxCellHighlight.prototype.keepOnTop
Reference to the enclosing mxGraph.
mxCellHighlight.prototype.graph
Reference to the mxCellState.
mxCellHighlight.prototype.state
Specifies the spacing between the highlight for vertices and the vertex.
mxCellHighlight.prototype.spacing
Holds the handler that automatically invokes reset if the highlight should be hidden.
mxCellHighlight.prototype.resetHandler
Sets the color of the rectangle used to highlight drop targets.
mxCellHighlight.prototype.setHighlightColor = function( color )
Creates and returns the highlight shape for the given state.
mxCellHighlight.prototype.drawHighlight = function()
Creates and returns the highlight shape for the given state.
mxCellHighlight.prototype.createShape = function()
Updates the highlight after a change of the model or view.
mxCellHighlight.prototype.repaint = function()
Resets the state of the cell marker.
mxCellHighlight.prototype.hide = function()
Returns true if this highlight is at the given position.
mxCellHighlight.prototype.isHighlightAt = function( x, y )
Destroys the handler and all its resources and DOM nodes.
mxCellHighlight.prototype.destroy = function()
Constructs a new default key handler for the mxEditor.graph in the given mxEditor.
function mxDefaultKeyHandler( editor )
Holds a mxGraph for displaying the diagram.
mxEditor.prototype.graph
Reference to the enclosing mxEditor.
mxDefaultKeyHandler.prototype.editor
Holds the mxKeyHandler for key event handling.
mxDefaultKeyHandler.prototype.handler
Binds the specified keycode to the given action in editor.
mxDefaultKeyHandler.prototype.bindAction = function ( code, action, control )
Destroys the handler associated with this object.
mxDefaultKeyHandler.prototype.destroy = function ()
Constructs a new popupmenu-factory based on given configuration.
function mxDefaultPopupMenu( config )
Base path for all icon attributes in the config.
mxDefaultPopupMenu.prototype.imageBasePath
XML node used as the description of new menu items.
mxDefaultPopupMenu.prototype.config
This function is called from mxEditor to add items to the given menu based on config.
mxDefaultPopupMenu.prototype.createMenu = function( editor, menu, cell, evt )
Recursively adds the given items and all of its children into the given menu.
mxDefaultPopupMenu.prototype.addItems = function( editor, menu, cell, evt, conditions, item, parent )
Helper method to bind an action to a new menu item.
mxDefaultPopupMenu.prototype.addAction = function( menu, editor, lab, icon, funct, action, cell, parent, iconCls, enabled )
Evaluates the default conditions for the given context.
mxDefaultPopupMenu.prototype.createConditions = function( editor, cell, evt )
Constructs a new toolbar for the given container and editor.
function mxDefaultToolbar( container, editor )
Reference to the enclosing mxEditor.
mxDefaultToolbar.prototype.editor
Holds the internal mxToolbar.
mxDefaultToolbar.prototype.toolbar
Reference to the function used to reset the toolbar.
mxDefaultToolbar.prototype.resetHandler
Defines the spacing between existing and new vertices in gridSize units when a new vertex is dropped on an existing cell.
mxDefaultToolbar.prototype.spacing
Specifies if elements should be connected if new cells are dropped onto connectable elements.
mxDefaultToolbar.prototype.connectOnDrop
Constructs the toolbar for the given container and installs a listener that updates the mxEditor.insertFunction on editor if an item is selected in the toolbar.
mxDefaultToolbar.prototype.init
Specifies the function to be used for inserting new cells into the graph.
mxEditor.prototype.insertFunction
Adds a new item that executes the given action in editor.
mxDefaultToolbar.prototype.addItem = function( title, icon, action, pressed )
Adds a vertical separator using the optional icon.
mxDefaultToolbar.prototype.addSeparator = function( icon )
Helper method to invoke mxToolbar.addCombo on toolbar and return the resulting DOM node.
mxDefaultToolbar.prototype.addCombo = function()
Helper method to invoke mxToolbar.addActionCombo on toolbar using the given title and return the resulting DOM node.
mxDefaultToolbar.prototype.addActionCombo = function( title )
Binds the given action to a option with the specified label in the given combo.
mxDefaultToolbar.prototype.addActionOption = function( combo, title, action )
Helper method to invoke mxToolbar.addOption on toolbar and return the resulting DOM node that represents the option.
mxDefaultToolbar.prototype.addOption = function( combo, title, value )
Creates an item for selecting the given mode in the editor’s graph.
mxDefaultToolbar.prototype.addMode = function( title, icon, mode, pressed, funct )
Creates an item for inserting a clone of the specified prototype cell into the editor’s graph.
mxDefaultToolbar.prototype.addPrototype = function( title, icon, ptype, pressed, insert, toggle )
Handles a drop from a toolbar item to the graph.
mxDefaultToolbar.prototype.drop = function( vertex, evt, target )
Handles a drop by inserting the given vertex into the given parent cell or the default parent if no parent is specified.
mxDefaultToolbar.prototype.insert = function( vertex, evt, target )
Handles a drop by connecting the given vertex to the given source cell.
mxDefaultToolbar.prototype.connect = function( vertex, evt, source )
Makes the given img draggable using the given function for handling a drop event.
mxDefaultToolbar.prototype.installDropHandler = function ( img, dropHandler )
Destroys the toolbar associated with this object and removes all installed listeners.
mxDefaultToolbar.prototype.destroy = function ()
Maps from actionnames to actions, which are functions taking the editor and the cell as arguments.
mxEditor.prototype.actions
Holds an mxUndoManager for the command history.
mxEditor.prototype.undoManager
Opens the specified file synchronously and parses it using readGraphModel.
mxEditor.prototype.open = function ( filename )
Posts the string returned by writeGraphModel to the given URL or the URL returned by getUrlPost.
mxEditor.prototype.save = function ( url, linefeed )
Hook for subclassers to override the posting of a diagram represented by the given node to the given URL.
mxEditor.prototype.postDiagram = function ( url, data )
Adds the given vertex as a child of parent at the specified x and y coordinate and fires an addVertex event.
mxEditor.prototype.addVertex = function ( parent, vertex, x, y )
Constructs a new editor.
function mxEditor( config )
Specifies the resource key for the zoom dialog.
mxEditor.prototype.askZoomResource
Specifies the resource key for the last saved info.
mxEditor.prototype.lastSavedResource
Specifies the resource key for the current file info.
mxEditor.prototype.currentFileResource
Specifies the resource key for the properties window title.
mxEditor.prototype.propertiesResource
Specifies the resource key for the tasks window title.
mxEditor.prototype.tasksResource
Specifies the resource key for the help window title.
mxEditor.prototype.helpResource
Specifies the resource key for the outline window title.
mxEditor.prototype.outlineResource
Reference to the mxWindow that contains the outline.
mxEditor.prototype.outline
Holds the render hint used for creating the graph in setGraphContainer.
mxEditor.prototype.graphRenderHint
Sets the graph’s container using mxGraph.init.
mxEditor.prototype.setGraphContainer = function ( container )
Holds a mxDefaultToolbar for displaying the toolbar.
mxEditor.prototype.toolbar
DOM container that holds the statusbar.
mxEditor.prototype.status
Holds a mxDefaultPopupMenu for displaying popupmenus.
mxEditor.prototype.popupHandler
Holds a mxDefaultKeyHandler for handling keyboard events.
mxEditor.prototype.keyHandler
Specifies the name of the action to be executed when a cell is double clicked.
mxEditor.prototype.dblClickAction
Specifies if new cells must be inserted into an existing swimlane.
mxEditor.prototype.swimlaneRequired
Specifies if the context menu should be disabled in the graph container.
mxEditor.prototype.disableContextMenu
Specifies if a new cell should be inserted on a single click even using insertFunction if there is a cell under the mousepointer, otherwise the cell under the mousepointer is selected.
mxEditor.prototype.forcedInserting
Maps from names to protoype cells to be used in the toolbar for inserting new cells into the diagram.
mxEditor.prototype.templates
Prototype edge cell that is used for creating new edges.
mxEditor.prototype.defaultEdge
Specifies the edge style to be returned in getEdgeStyle.
mxEditor.prototype.defaultEdgeStyle
Returns a string identifying the style of new edges.
mxEditor.prototype.getEdgeStyle = function ()
Prototype group cell that is used for creating new groups.
mxEditor.prototype.defaultGroup
Default size for the border of new groups.
mxEditor.prototype.groupBorderSize
Contains the URL of the last opened file as a string.
mxEditor.prototype.filename
Specifies if the name of the post parameter that contains the diagram data in a post request to the server.
mxEditor.prototype.postParameterName
Specifies if the data in the post request for saving a diagram should be converted using encodeURIComponent.
mxEditor.prototype.escapePostData
Specifies the URL to be used for posting the diagram to a backend in save.
mxEditor.prototype.urlPost
Specifies the URL to be used for creating a bitmap of the graph in the image action.
mxEditor.prototype.urlImage
Specifies the direction of the flow in the diagram.
mxEditor.prototype.horizontalFlow
Specifies if the top-level elements in the diagram should be layed out using a vertical or horizontal stack depending on the setting of horizontalFlow.
mxEditor.prototype.layoutDiagram
Specifies the spacing between swimlanes if automatic layout is turned on in layoutDiagram.
mxEditor.prototype.swimlaneSpacing
Specifies if the swimlanes should be kept at the same width or height depending on the setting of horizontalFlow.
mxEditor.prototype.maintainSwimlanes
Specifies if the children of swimlanes should be layed out, either vertically or horizontally depending on horizontalFlow.
mxEditor.prototype.layoutSwimlanes
Specifies the attribute values to be cycled when inserting new swimlanes.
mxEditor.prototype.cycleAttributeValues
Index of the last consumed attribute index.
mxEditor.prototype.cycleAttributeIndex
Name of the attribute to be assigned a cycleAttributeValues when inserting new swimlanes.
mxEditor.prototype.cycleAttributeName
Holds the mxWindow created in showTasks.
mxEditor.prototype.tasks
Shows the tasks window.
mxEditor.prototype.showTasks = function ()
Icon for the tasks window.
mxEditor.prototype.tasksWindowImage
Specifies the top coordinate of the tasks window in pixels.
mxEditor.prototype.tasksTop
Holds the mxWindow created in showHelp.
mxEditor.prototype.help
Shows the help window.
mxEditor.prototype.showHelp = function ( tasks )
Icon for the help window.
mxEditor.prototype.helpWindowImage
Specifies the URL to be used for the contents of the Online Help window.
mxEditor.prototype.urlHelp
Specifies the width of the help window in pixels.
mxEditor.prototype.helpWidth
Specifies the height of the help window in pixels.
mxEditor.prototype.helpHeight
Specifies the width of the properties window in pixels.
mxEditor.prototype.propertiesWidth
Specifies the height of the properties window in pixels.
mxEditor.prototype.propertiesHeight
Specifies if the properties dialog should be automatically moved near the cell it is displayed for, otherwise the dialog is not moved.
mxEditor.prototype.movePropertiesDialog
Specifies if mxGraph.validateGraph should automatically be invoked after each change.
mxEditor.prototype.validating
True if the graph has been modified since it was last saved.
mxEditor.prototype.modified
Returns modified.
mxEditor.prototype.isModified = function ()
Sets modified to the specified boolean value.
mxEditor.prototype.setModified = function ( value )
Adds the built-in actions to the editor instance.
mxEditor.prototype.addActions = function ()
Configures the editor using the specified node.
mxEditor.prototype.configure = function ( node )
Resets the cookie that is used to remember if the editor has already been used.
mxEditor.prototype.resetFirstTime = function ()
Resets the command history, modified state and counters.
mxEditor.prototype.resetHistory = function ()
Binds the specified actionname to the specified function.
mxEditor.prototype.addAction = function ( actionname, funct )
Executes the function with the given name in actions passing the editor instance and given cell as the first and second argument.
mxEditor.prototype.execute = function ( actionname, cell, evt )
Adds the specified template under the given name in templates.
mxEditor.prototype.addTemplate = function ( name, template )
Returns the template for the given name.
mxEditor.prototype.getTemplate = function ( name )
Creates the graph for the editor.
mxEditor.prototype.createGraph = function ()
Sets the graph’s container using mxGraph.init.
mxEditor.prototype.createSwimlaneManager = function ( graph )
Creates a layout manager for the swimlane and diagram layouts, that is, the locally defined inter- and intraswimlane layouts.
mxEditor.prototype.createLayoutManager = function ( graph )
Overrides mxGraph.dblClick to invoke dblClickAction on a cell and reset the selection tool in the toolbar.
mxEditor.prototype.installDblClickHandler = function ( graph )
Adds the undoManager to the graph model and the view.
mxEditor.prototype.installUndoHandler = function ( graph )
Installs listeners for dispatching the root event.
mxEditor.prototype.installDrillHandler = function ( graph )
Installs the listeners required to automatically validate the graph.
mxEditor.prototype.installChangeHandler = function ( graph )
Installs the handler for invoking insertFunction if one is defined.
mxEditor.prototype.installInsertHandler = function ( graph )
Creates the layout instance used to layout the swimlanes in the diagram.
mxEditor.prototype.createDiagramLayout = function ()
Creates the layout instance used to layout the children of each swimlane.
mxEditor.prototype.createSwimlaneLayout = function ()
Creates the toolbar with no container.
mxEditor.prototype.createToolbar = function ()
Initializes the toolbar for the given container.
mxEditor.prototype.setToolbarContainer = function ( container )
Creates the status using the specified container.
mxEditor.prototype.setStatusContainer = function ( container )
Display the specified message in the status bar.
mxEditor.prototype.setStatus = function ( message )
Creates a listener to update the inner HTML of the specified DOM node with the value of getTitle.
mxEditor.prototype.setTitleContainer = function ( container )
Returns the string value for the current root of the diagram.
mxEditor.prototype.getTitle = function ()
Executes a vertical or horizontal compact tree layout using the specified cell as an argument.
mxEditor.prototype.treeLayout = function ( cell, horizontal )
Returns the string value of the root cell in mxGraph.model.
mxEditor.prototype.getRootTitle = function ()
Undo the last change in graph.
mxEditor.prototype.undo = function ()
Redo the last change in graph.
mxEditor.prototype.redo = function ()
Invokes createGroup to create a new group cell and the invokes mxGraph.groupCells, using the grid size of the graph as the spacing in the group’s content area.
mxEditor.prototype.groupCells = function ()
Creates and returns a clone of defaultGroup to be used as a new group cell in group.
mxEditor.prototype.createGroup = function ()
Reads the specified XML node into the existing graph model and resets the command history and modified state.
mxEditor.prototype.readGraphModel = function ( node )
Hook to create the string representation of the diagram.
mxEditor.prototype.writeGraphModel = function ( linefeed )
Returns the URL to post the diagram to.
mxEditor.prototype.getUrlPost = function ()
Returns the URL to create the image with.
mxEditor.prototype.getUrlImage = function ()
Swaps the styles for the given names in the graph’s stylesheet and refreshes the graph.
mxEditor.prototype.swapStyles = function ( first, second )
Creates and shows the properties dialog for the given cell.
mxEditor.prototype.showProperties = function ( cell )
Returns true if the properties dialog is currently visible.
mxEditor.prototype.isPropertiesVisible = function ()
Creates and returns the DOM node that represents the contents of the properties dialog for the given cell.
mxEditor.prototype.createProperties = function ( cell )
Hides the properties dialog.
mxEditor.prototype.hideProperties = function ()
Updates the contents of the tasks window using createTasks.
mxEditor.prototype.refreshTasks = function ( div )
Updates the contents of the given DOM node to display the tasks associated with the current editor state.
mxEditor.prototype.createTasks = function ( div )
Shows the outline window.
mxEditor.prototype.showOutline = function ()
Puts the graph into the specified mode.
mxEditor.prototype.setMode = function( modename )
Uses popupHandler to create the menu in the graph’s panning handler.
mxEditor.prototype.createPopupMenu = function ( menu, cell, evt )
Uses defaultEdge as the prototype for creating new edges in the connection handler of the graph.
mxEditor.prototype.createEdge = function ( source, target )
Returns the next attribute in cycleAttributeValues or null, if not attribute should be used in the specified cell.
mxEditor.prototype.consumeCycleAttribute = function ( cell )
Uses the returned value from consumeCycleAttribute as the value for the cycleAttributeName key in the given cell’s style.
mxEditor.prototype.cycleAttribute = function ( cell )
Removes the editor and all its associated resources.
mxEditor.prototype.destroy = function ()
Registers a new codec and associates the name of the template constructor in the codec with the codec object.
register: function( codec )
Adds an alias for mapping a classname to a codecname.
addAlias: function( classname, codecname )
Returns a codec that handles objects that are constructed using the given constructor.
getCodec: function( ctor )
Constructs an XML encoder/decoder for the specified owner document.
function mxCodec( document )
The owner document of the codec.
mxCodec.prototype.document
Maps from IDs to objects.
mxCodec.prototype.objects
Lookup table for resolving IDs to elements.
mxCodec.prototype.elements
Specifies if default values should be encoded.
mxCodec.prototype.encodeDefaults
Assoiates the given object with the given ID and returns the given object.
mxCodec.prototype.putObject = function( id, obj )
Returns the decoded object for the element with the specified ID in document.
mxCodec.prototype.getObject = function( id )
Hook for subclassers to implement a custom lookup mechanism for cell IDs.
mxCodec.prototype.lookup = function( id )
Returns the element with the given ID from document.
mxCodec.prototype.getElementById = function( id )
Returns the element with the given ID from document.
mxCodec.prototype.updateElements = function()
Adds the given element to elements if it has an ID.
mxCodec.prototype.addElement = function( node )
Returns the ID of the specified object.
mxCodec.prototype.getId = function( obj )
Hook for subclassers to implement a custom method for retrieving IDs from objects.
mxCodec.prototype.reference = function( obj )
Encodes the specified object and returns the resulting XML node.
mxCodec.prototype.encode = function( obj )
Decodes the given XML node.
mxCodec.prototype.decode = function( node, into )
Encoding of cell hierarchies is built-into the core, but is a higher-level function that needs to be explicitely used by the respective object encoders (eg.
mxCodec.prototype.encodeCell = function( cell, node, includeChildren )
Returns true if the given codec is a cell codec.
mxCodec.prototype.isCellCodec = function( codec )
Decodes cells that have been encoded using inversion, ie.
mxCodec.prototype.decodeCell = function( node, restoreStructures )
Inserts the given cell into its parent and terminal cells.
mxCodec.prototype.insertIntoGraph = function( cell )
Sets the attribute on the specified node to value.
mxCodec.prototype.setAttribute = function( node, attribute, value )
Constructs a new codec for the specified template object.
function mxObjectCodec( template, exclude, idrefs, mapping )
Static global switch that specifies if expressions in arrays are allowed.
mxObjectCodec.allowEval
Holds the template object associated with this codec.
mxObjectCodec.prototype.template
Array containing the variable names that should be ignored by the codec.
mxObjectCodec.prototype.exclude
Array containing the variable names that should be turned into or converted from references.
mxObjectCodec.prototype.idrefs
Maps from from fieldnames to XML attribute names.
mxObjectCodec.prototype.mapping
Maps from from XML attribute names to fieldnames.
mxObjectCodec.prototype.reverse
Returns the name used for the nodenames and lookup of the codec when classes are encoded and nodes are decoded.
mxObjectCodec.prototype.getName = function()
Returns a new instance of the template for this codec.
mxObjectCodec.prototype.cloneTemplate = function()
Returns the fieldname for the given attributename.
mxObjectCodec.prototype.getFieldName = function( attributename )
Returns the attributename for the given fieldname.
mxObjectCodec.prototype.getAttributeName = function( fieldname )
Returns true if the given attribute is to be ignored by the codec.
mxObjectCodec.prototype.isExcluded = function( obj, attr, value, write )
Returns true if the given fieldname is to be treated as a textual reference (ID).
mxObjectCodec.prototype.isReference = function( obj, attr, value, write )
Encodes the specified object and returns a node representing then given object.
mxObjectCodec.prototype.encode = function( enc, obj )
Encodes the value of each member in then given obj into the given node using encodeValue.
mxObjectCodec.prototype.encodeObject = function( enc, obj, node )
Converts the given value according to the mappings and id-refs in this codec and uses writeAttribute to write the attribute into the given node.
mxObjectCodec.prototype.encodeValue = function( enc, obj, name, value, node )
Writes the given value into node using writePrimitiveAttribute or writeComplexAttribute depending on the type of the value.
mxObjectCodec.prototype.writeAttribute = function( enc, obj, name, value, node )
Writes the given value as an attribute of the given node.
mxObjectCodec.prototype.writePrimitiveAttribute = function( enc, obj, name, value, node )
Writes the given value as a child node of the given node.
mxObjectCodec.prototype.writeComplexAttribute = function( enc, obj, name, value, node )
Converts true to “1” and false to “0” is isBooleanAttribute returns true.
mxObjectCodec.prototype.convertAttributeToXml = function( enc, obj, name, value )
Returns true if the given object attribute is a boolean value.
mxObjectCodec.prototype.isBooleanAttribute = function( enc, obj, name, value )
Converts booleans and numeric values to the respective types.
mxObjectCodec.prototype.convertAttributeFromXml = function( dec, attr, obj )
Returns true if the given XML attribute is or should be a numeric value.
mxObjectCodec.prototype.isNumericAttribute = function( dec, attr, obj )
Hook for subclassers to pre-process the object before encoding.
mxObjectCodec.prototype.beforeEncode = function( enc, obj, node )
Hook for subclassers to post-process the node for the given object after encoding and return the post-processed node.
mxObjectCodec.prototype.afterEncode = function( enc, obj, node )
Parses the given node into the object or returns a new object representing the given node.
mxObjectCodec.prototype.decode = function( dec, node, into )
Calls decodeAttributes and decodeChildren for the given node.
mxObjectCodec.prototype.decodeNode = function( dec, node, obj )
Decodes all attributes of the given node using decodeAttribute.
mxObjectCodec.prototype.decodeAttributes = function( dec, node, obj )
Decodes all children of the given node using decodeChild.
mxObjectCodec.prototype.decodeChildren = function( dec, node, obj )
Reads the given attribute into the specified object.
mxObjectCodec.prototype.decodeAttribute = function( dec, attr, obj )
Returns true if the given attribute should be ignored.
mxObjectCodec.prototype.isIgnoredAttribute = function( dec, attr, obj )
Reads the specified child into the given object.
mxObjectCodec.prototype.decodeChild = function( dec, child, obj )
Returns the template instance for the given field.
mxObjectCodec.prototype.getFieldTemplate = function( obj, fieldname, child )
Sets the decoded child node as a value of the given object.
mxObjectCodec.prototype.addObjectValue = function( obj, fieldname, value, template )
Returns true if the given node is an include directive and executes the include by decoding the XML document.
mxObjectCodec.prototype.processInclude = function( dec, node, into )
Hook for subclassers to pre-process the node for the specified object and return the node to be used for further processing by decode.
mxObjectCodec.prototype.beforeDecode = function( dec, node, obj )
Hook for subclassers to post-process the object after decoding.
mxObjectCodec.prototype.afterDecode = function( dec, node, obj )
Returns true since this is a cell codec.
codec.isCellCodec = function()
Excludes user objects that are XML nodes.
codec.isExcluded = function( obj, attr, value, isWrite )
Encodes an mxCell and wraps the XML up inside the XML of the user object (inversion).
codec.afterEncode = function( enc, obj, node )
Decodes an mxCell and uses the enclosing XML node as the user object for the cell (inversion).
codec.beforeDecode = function( dec, node, obj )
Encodes the given mxGraphModel by writing a (flat) XML sequence of cell nodes as produced by the mxCellCodec.
codec.encodeObject = function( enc, obj, node )
Overrides decode child to handle special child nodes.
codec.decodeChild = function( dec, child, obj )
Reads the cells into the graph model.
codec.decodeRoot = function( dec, root, model )
Decodes the optional children as cells using the respective decoder.
codec.beforeDecode = function( dec, node, obj )
Restores the state by assigning the previous value.
codec.afterDecode = function( dec, node, obj )
Returns true for the child attribute if the child cell had a previous parent or if we’re reading the child as an attribute rather than a child node, in which case it’s always a reference.
codec.isReference = function( obj, attr, value, isWrite )
Excludes references to parent or previous if not in the model.
codec.isExcluded = function( obj, attr, value, write )
Encodes the child recusively and adds the result to the given node.
codec.afterEncode = function( enc, obj, node )
Decodes the any child nodes as using the respective codec from the registry.
codec.beforeDecode = function( dec, node, obj )
Restores object state in the child change.
codec.afterDecode = function( dec, node, obj )
Restores the state by assigning the previous value.
codec.afterDecode = function( dec, node, obj )
Factory function that creates a mxObjectCodec for the specified change and fieldname.
var mxGenericChangeCodec = function( obj, variable )
Restores the state by assigning the previous value.
codec.afterDecode = function( dec, node, obj )
Encodes the given mxGraphView using encodeCell starting at the model’s root.
codec.encode = function( enc, view )
Recursively encodes the specifed cell.
codec.encodeCell = function( enc, view, cell )
Encodes a stylesheet.
codec.encode = function( enc, obj )
Returns the string for encoding the given value.
codec.getStringValue = function( key, value )
Reads a sequence of the following child nodes and attributes:
codec.decode = function( dec, node, into )
Static global switch that specifies if the use of eval is allowed for evaluating text content.
mxStylesheetCodec.allowEval
Returns null.
codec.encode = function( enc, obj )
Reads a sequence of the following child nodes and attributes:
codec.decode = function( dec, node, into )
Returns null.
codec.encode = function( enc, obj )
Reads a sequence of the following child nodes and attributes:
codec.decode = function( dec, node, into )
Static global switch that specifies if the use of eval is allowed for evaluating text content.
mxDefaultToolbarCodec.allowEval
Returns null.
codec.encode = function( enc, obj )
Uses the given node as the config for mxDefaultPopupMenu.
codec.decode = function( dec, node, into )
Overrides decode child to handle special child nodes.
codec.decodeChild = function( dec, child, obj )
Decodes the cells from the given node as templates.
codec.decodeTemplates = function( dec, node, editor )
Overrides validate to normalize validation view state and pass current state to CSS transform.
var graphViewValidate = mxGraphView.prototype.validate; mxGraphView.prototype.validate = function( cell )